效果
用于控制文本元素阴影的实用工具。
| 类名 | 样式 |
|---|---|
text-shadow-2xs | text-shadow: var(--text-shadow-2xs); /* 0px 1px 0px rgb(0 0 0 / 0.15) */ |
text-shadow-xs | text-shadow: var(--text-shadow-xs); /* 0px 1px 1px rgb(0 0 0 / 0.2) */ |
text-shadow-sm | text-shadow: var(--text-shadow-sm); /* 0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075) */ |
text-shadow-md | text-shadow: var(--text-shadow-md); /* 0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1) */ |
text-shadow-lg | text-shadow: var(--text-shadow-lg); /* 0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1) */ |
text-shadow-none | text-shadow: none; |
text-shadow-(<custom-property>) | text-shadow: var(<custom-property>); |
text-shadow-(color:<custom-property>) | --tw-shadow-color var(<custom-property>); |
text-shadow-[<value>] | text-shadow: <value>; |
text-shadow-inherit | --tw-shadow-color inherit; |
text-shadow-current | --tw-shadow-color currentColor; |
text-shadow-transparent | --tw-shadow-color transparent; |
shadow-black | --tw-shadow-color var(--color-black); /* #000 */ |
shadow-white | --tw-shadow-color var(--color-white); /* #fff */ |
shadow-red-50 | --tw-shadow-color var(--color-red-50); /* oklch(97.1% 0.013 17.38) */ |
shadow-red-100 | --tw-shadow-color var(--color-red-100); /* oklch(93.6% 0.032 17.717) */ |
shadow-red-200 | --tw-shadow-color var(--color-red-200); /* oklch(88.5% 0.062 18.334) */ |
shadow-red-300 | --tw-shadow-color var(--color-red-300); /* oklch(80.8% 0.114 19.571) */ |
shadow-red-400 | --tw-shadow-color var(--color-red-400); /* oklch(70.4% 0.191 22.216) */ |
shadow-red-500 | --tw-shadow-color var(--color-red-500); /* oklch(63.7% 0.237 25.331) */ |
shadow-red-600 | --tw-shadow-color var(--color-red-600); /* oklch(57.7% 0.245 27.325) */ |
shadow-red-700 | --tw-shadow-color var(--color-red-700); /* oklch(50.5% 0.213 27.518) */ |
shadow-red-800 | --tw-shadow-color var(--color-red-800); /* oklch(44.4% 0.177 26.899) */ |
shadow-red-900 | --tw-shadow-color var(--color-red-900); /* oklch(39.6% 0.141 25.723) */ |
shadow-red-950 | --tw-shadow-color var(--color-red-950); /* oklch(25.8% 0.092 26.042) */ |
shadow-orange-50 | --tw-shadow-color var(--color-orange-50); /* oklch(98% 0.016 73.684) */ |
shadow-orange-100 | --tw-shadow-color var(--color-orange-100); /* oklch(95.4% 0.038 75.164) */ |
shadow-orange-200 | --tw-shadow-color var(--color-orange-200); /* oklch(90.1% 0.076 70.697) */ |
shadow-orange-300 | --tw-shadow-color var(--color-orange-300); /* oklch(83.7% 0.128 66.29) */ |
shadow-orange-400 | --tw-shadow-color var(--color-orange-400); /* oklch(75% 0.183 55.934) */ |
shadow-orange-500 | --tw-shadow-color var(--color-orange-500); /* oklch(70.5% 0.213 47.604) */ |
shadow-orange-600 | --tw-shadow-color var(--color-orange-600); /* oklch(64.6% 0.222 41.116) */ |
shadow-orange-700 | --tw-shadow-color var(--color-orange-700); /* oklch(55.3% 0.195 38.402) */ |
shadow-orange-800 | --tw-shadow-color var(--color-orange-800); /* oklch(47% 0.157 37.304) */ |
shadow-orange-900 | --tw-shadow-color var(--color-orange-900); /* oklch(40.8% 0.123 38.172) */ |
shadow-orange-950 | --tw-shadow-color var(--color-orange-950); /* oklch(26.6% 0.079 36.259) */ |
shadow-amber-50 | --tw-shadow-color var(--color-amber-50); /* oklch(98.7% 0.022 95.277) */ |
shadow-amber-100 | --tw-shadow-color var(--color-amber-100); /* oklch(96.2% 0.059 95.617) */ |
shadow-amber-200 | --tw-shadow-color var(--color-amber-200); /* oklch(92.4% 0.12 95.746) */ |
shadow-amber-300 | --tw-shadow-color var(--color-amber-300); /* oklch(87.9% 0.169 91.605) */ |
shadow-amber-400 | --tw-shadow-color var(--color-amber-400); /* oklch(82.8% 0.189 84.429) */ |
shadow-amber-500 | --tw-shadow-color var(--color-amber-500); /* oklch(76.9% 0.188 70.08) */ |
shadow-amber-600 | --tw-shadow-color var(--color-amber-600); /* oklch(66.6% 0.179 58.318) */ |
shadow-amber-700 | --tw-shadow-color var(--color-amber-700); /* oklch(55.5% 0.163 48.998) */ |
shadow-amber-800 | --tw-shadow-color var(--color-amber-800); /* oklch(47.3% 0.137 46.201) */ |
shadow-amber-900 | --tw-shadow-color var(--color-amber-900); /* oklch(41.4% 0.112 45.904) */ |
shadow-amber-950 | --tw-shadow-color var(--color-amber-950); /* oklch(27.9% 0.077 45.635) */ |
shadow-yellow-50 | --tw-shadow-color var(--color-yellow-50); /* oklch(98.7% 0.026 102.212) */ |
shadow-yellow-100 | --tw-shadow-color var(--color-yellow-100); /* oklch(97.3% 0.071 103.193) */ |
shadow-yellow-200 | --tw-shadow-color var(--color-yellow-200); /* oklch(94.5% 0.129 101.54) */ |
shadow-yellow-300 | --tw-shadow-color var(--color-yellow-300); /* oklch(90.5% 0.182 98.111) */ |
shadow-yellow-400 | --tw-shadow-color var(--color-yellow-400); /* oklch(85.2% 0.199 91.936) */ |
shadow-yellow-500 | --tw-shadow-color var(--color-yellow-500); /* oklch(79.5% 0.184 86.047) */ |
shadow-yellow-600 | --tw-shadow-color var(--color-yellow-600); /* oklch(68.1% 0.162 75.834) */ |
shadow-yellow-700 | --tw-shadow-color var(--color-yellow-700); /* oklch(55.4% 0.135 66.442) */ |
shadow-yellow-800 | --tw-shadow-color var(--color-yellow-800); /* oklch(47.6% 0.114 61.907) */ |
shadow-yellow-900 | --tw-shadow-color var(--color-yellow-900); /* oklch(42.1% 0.095 57.708) */ |
shadow-yellow-950 | --tw-shadow-color var(--color-yellow-950); /* oklch(28.6% 0.066 53.813) */ |
shadow-lime-50 | --tw-shadow-color var(--color-lime-50); /* oklch(98.6% 0.031 120.757) */ |
shadow-lime-100 | --tw-shadow-color var(--color-lime-100); /* oklch(96.7% 0.067 122.328) */ |
shadow-lime-200 | --tw-shadow-color var(--color-lime-200); /* oklch(93.8% 0.127 124.321) */ |
shadow-lime-300 | --tw-shadow-color var(--color-lime-300); /* oklch(89.7% 0.196 126.665) */ |
shadow-lime-400 | --tw-shadow-color var(--color-lime-400); /* oklch(84.1% 0.238 128.85) */ |
shadow-lime-500 | --tw-shadow-color var(--color-lime-500); /* oklch(76.8% 0.233 130.85) */ |
shadow-lime-600 | --tw-shadow-color var(--color-lime-600); /* oklch(64.8% 0.2 131.684) */ |
shadow-lime-700 | --tw-shadow-color var(--color-lime-700); /* oklch(53.2% 0.157 131.589) */ |
shadow-lime-800 | --tw-shadow-color var(--color-lime-800); /* oklch(45.3% 0.124 130.933) */ |
shadow-lime-900 | --tw-shadow-color var(--color-lime-900); /* oklch(40.5% 0.101 131.063) */ |
shadow-lime-950 | --tw-shadow-color var(--color-lime-950); /* oklch(27.4% 0.072 132.109) */ |
shadow-green-50 | --tw-shadow-color var(--color-green-50); /* oklch(98.2% 0.018 155.826) */ |
shadow-green-100 | --tw-shadow-color var(--color-green-100); /* oklch(96.2% 0.044 156.743) */ |
shadow-green-200 | --tw-shadow-color var(--color-green-200); /* oklch(92.5% 0.084 155.995) */ |
shadow-green-300 | --tw-shadow-color var(--color-green-300); /* oklch(87.1% 0.15 154.449) */ |
shadow-green-400 | --tw-shadow-color var(--color-green-400); /* oklch(79.2% 0.209 151.711) */ |
shadow-green-500 | --tw-shadow-color var(--color-green-500); /* oklch(72.3% 0.219 149.579) */ |
shadow-green-600 | --tw-shadow-color var(--color-green-600); /* oklch(62.7% 0.194 149.214) */ |
shadow-green-700 | --tw-shadow-color var(--color-green-700); /* oklch(52.7% 0.154 150.069) */ |
shadow-green-800 | --tw-shadow-color var(--color-green-800); /* oklch(44.8% 0.119 151.328) */ |
shadow-green-900 | --tw-shadow-color var(--color-green-900); /* oklch(39.3% 0.095 152.535) */ |
shadow-green-950 | --tw-shadow-color var(--color-green-950); /* oklch(26.6% 0.065 152.934) */ |
shadow-emerald-50 | --tw-shadow-color var(--color-emerald-50); /* oklch(97.9% 0.021 166.113) */ |
shadow-emerald-100 | --tw-shadow-color var(--color-emerald-100); /* oklch(95% 0.052 163.051) */ |
shadow-emerald-200 | --tw-shadow-color var(--color-emerald-200); /* oklch(90.5% 0.093 164.15) */ |
shadow-emerald-300 | --tw-shadow-color var(--color-emerald-300); /* oklch(84.5% 0.143 164.978) */ |
shadow-emerald-400 | --tw-shadow-color var(--color-emerald-400); /* oklch(76.5% 0.177 163.223) */ |
shadow-emerald-500 | --tw-shadow-color var(--color-emerald-500); /* oklch(69.6% 0.17 162.48) */ |
shadow-emerald-600 | --tw-shadow-color var(--color-emerald-600); /* oklch(59.6% 0.145 163.225) */ |
shadow-emerald-700 | --tw-shadow-color var(--color-emerald-700); /* oklch(50.8% 0.118 165.612) */ |
shadow-emerald-800 | --tw-shadow-color var(--color-emerald-800); /* oklch(43.2% 0.095 166.913) */ |
shadow-emerald-900 | --tw-shadow-color var(--color-emerald-900); /* oklch(37.8% 0.077 168.94) */ |
shadow-emerald-950 | --tw-shadow-color var(--color-emerald-950); /* oklch(26.2% 0.051 172.552) */ |
shadow-teal-50 | --tw-shadow-color var(--color-teal-50); /* oklch(98.4% 0.014 180.72) */ |
shadow-teal-100 | --tw-shadow-color var(--color-teal-100); /* oklch(95.3% 0.051 180.801) */ |
shadow-teal-200 | --tw-shadow-color var(--color-teal-200); /* oklch(91% 0.096 180.426) */ |
shadow-teal-300 | --tw-shadow-color var(--color-teal-300); /* oklch(85.5% 0.138 181.071) */ |
shadow-teal-400 | --tw-shadow-color var(--color-teal-400); /* oklch(77.7% 0.152 181.912) */ |
shadow-teal-500 | --tw-shadow-color var(--color-teal-500); /* oklch(70.4% 0.14 182.503) */ |
shadow-teal-600 | --tw-shadow-color var(--color-teal-600); /* oklch(60% 0.118 184.704) */ |
shadow-teal-700 | --tw-shadow-color var(--color-teal-700); /* oklch(51.1% 0.096 186.391) */ |
shadow-teal-800 | --tw-shadow-color var(--color-teal-800); /* oklch(43.7% 0.078 188.216) */ |
shadow-teal-900 | --tw-shadow-color var(--color-teal-900); /* oklch(38.6% 0.063 188.416) */ |
shadow-teal-950 | --tw-shadow-color var(--color-teal-950); /* oklch(27.7% 0.046 192.524) */ |
shadow-cyan-50 | --tw-shadow-color var(--color-cyan-50); /* oklch(98.4% 0.019 200.873) */ |
shadow-cyan-100 | --tw-shadow-color var(--color-cyan-100); /* oklch(95.6% 0.045 203.388) */ |
shadow-cyan-200 | --tw-shadow-color var(--color-cyan-200); /* oklch(91.7% 0.08 205.041) */ |
shadow-cyan-300 | --tw-shadow-color var(--color-cyan-300); /* oklch(86.5% 0.127 207.078) */ |
shadow-cyan-400 | --tw-shadow-color var(--color-cyan-400); /* oklch(78.9% 0.154 211.53) */ |
shadow-cyan-500 | --tw-shadow-color var(--color-cyan-500); /* oklch(71.5% 0.143 215.221) */ |
shadow-cyan-600 | --tw-shadow-color var(--color-cyan-600); /* oklch(60.9% 0.126 221.723) */ |
shadow-cyan-700 | --tw-shadow-color var(--color-cyan-700); /* oklch(52% 0.105 223.128) */ |
shadow-cyan-800 | --tw-shadow-color var(--color-cyan-800); /* oklch(45% 0.085 224.283) */ |
shadow-cyan-900 | --tw-shadow-color var(--color-cyan-900); /* oklch(39.8% 0.07 227.392) */ |
shadow-cyan-950 | --tw-shadow-color var(--color-cyan-950); /* oklch(30.2% 0.056 229.695) */ |
shadow-sky-50 | --tw-shadow-color var(--color-sky-50); /* oklch(97.7% 0.013 236.62) */ |
shadow-sky-100 | --tw-shadow-color var(--color-sky-100); /* oklch(95.1% 0.026 236.824) */ |
shadow-sky-200 | --tw-shadow-color var(--color-sky-200); /* oklch(90.1% 0.058 230.902) */ |
shadow-sky-300 | --tw-shadow-color var(--color-sky-300); /* oklch(82.8% 0.111 230.318) */ |
shadow-sky-400 | --tw-shadow-color var(--color-sky-400); /* oklch(74.6% 0.16 232.661) */ |
shadow-sky-500 | --tw-shadow-color var(--color-sky-500); /* oklch(68.5% 0.169 237.323) */ |
shadow-sky-600 | --tw-shadow-color var(--color-sky-600); /* oklch(58.8% 0.158 241.966) */ |
shadow-sky-700 | --tw-shadow-color var(--color-sky-700); /* oklch(50% 0.134 242.749) */ |
shadow-sky-800 | --tw-shadow-color var(--color-sky-800); /* oklch(44.3% 0.11 240.79) */ |
shadow-sky-900 | --tw-shadow-color var(--color-sky-900); /* oklch(39.1% 0.09 240.876) */ |
shadow-sky-950 | --tw-shadow-color var(--color-sky-950); /* oklch(29.3% 0.066 243.157) */ |
shadow-blue-50 | --tw-shadow-color var(--color-blue-50); /* oklch(97% 0.014 254.604) */ |
shadow-blue-100 | --tw-shadow-color var(--color-blue-100); /* oklch(93.2% 0.032 255.585) */ |
shadow-blue-200 | --tw-shadow-color var(--color-blue-200); /* oklch(88.2% 0.059 254.128) */ |
shadow-blue-300 | --tw-shadow-color var(--color-blue-300); /* oklch(80.9% 0.105 251.813) */ |
shadow-blue-400 | --tw-shadow-color var(--color-blue-400); /* oklch(70.7% 0.165 254.624) */ |
shadow-blue-500 | --tw-shadow-color var(--color-blue-500); /* oklch(62.3% 0.214 259.815) */ |
shadow-blue-600 | --tw-shadow-color var(--color-blue-600); /* oklch(54.6% 0.245 262.881) */ |
shadow-blue-700 | --tw-shadow-color var(--color-blue-700); /* oklch(48.8% 0.243 264.376) */ |
shadow-blue-800 | --tw-shadow-color var(--color-blue-800); /* oklch(42.4% 0.199 265.638) */ |
shadow-blue-900 | --tw-shadow-color var(--color-blue-900); /* oklch(37.9% 0.146 265.522) */ |
shadow-blue-950 | --tw-shadow-color var(--color-blue-950); /* oklch(28.2% 0.091 267.935) */ |
shadow-indigo-50 | --tw-shadow-color var(--color-indigo-50); /* oklch(96.2% 0.018 272.314) */ |
shadow-indigo-100 | --tw-shadow-color var(--color-indigo-100); /* oklch(93% 0.034 272.788) */ |
shadow-indigo-200 | --tw-shadow-color var(--color-indigo-200); /* oklch(87% 0.065 274.039) */ |
shadow-indigo-300 | --tw-shadow-color var(--color-indigo-300); /* oklch(78.5% 0.115 274.713) */ |
shadow-indigo-400 | --tw-shadow-color var(--color-indigo-400); /* oklch(67.3% 0.182 276.935) */ |
shadow-indigo-500 | --tw-shadow-color var(--color-indigo-500); /* oklch(58.5% 0.233 277.117) */ |
shadow-indigo-600 | --tw-shadow-color var(--color-indigo-600); /* oklch(51.1% 0.262 276.966) */ |
shadow-indigo-700 | --tw-shadow-color var(--color-indigo-700); /* oklch(45.7% 0.24 277.023) */ |
shadow-indigo-800 | --tw-shadow-color var(--color-indigo-800); /* oklch(39.8% 0.195 277.366) */ |
shadow-indigo-900 | --tw-shadow-color var(--color-indigo-900); /* oklch(35.9% 0.144 278.697) */ |
shadow-indigo-950 | --tw-shadow-color var(--color-indigo-950); /* oklch(25.7% 0.09 281.288) */ |
shadow-violet-50 | --tw-shadow-color var(--color-violet-50); /* oklch(96.9% 0.016 293.756) */ |
shadow-violet-100 | --tw-shadow-color var(--color-violet-100); /* oklch(94.3% 0.029 294.588) */ |
shadow-violet-200 | --tw-shadow-color var(--color-violet-200); /* oklch(89.4% 0.057 293.283) */ |
shadow-violet-300 | --tw-shadow-color var(--color-violet-300); /* oklch(81.1% 0.111 293.571) */ |
shadow-violet-400 | --tw-shadow-color var(--color-violet-400); /* oklch(70.2% 0.183 293.541) */ |
shadow-violet-500 | --tw-shadow-color var(--color-violet-500); /* oklch(60.6% 0.25 292.717) */ |
shadow-violet-600 | --tw-shadow-color var(--color-violet-600); /* oklch(54.1% 0.281 293.009) */ |
shadow-violet-700 | --tw-shadow-color var(--color-violet-700); /* oklch(49.1% 0.27 292.581) */ |
shadow-violet-800 | --tw-shadow-color var(--color-violet-800); /* oklch(43.2% 0.232 292.759) */ |
shadow-violet-900 | --tw-shadow-color var(--color-violet-900); /* oklch(38% 0.189 293.745) */ |
shadow-violet-950 | --tw-shadow-color var(--color-violet-950); /* oklch(28.3% 0.141 291.089) */ |
shadow-purple-50 | --tw-shadow-color var(--color-purple-50); /* oklch(97.7% 0.014 308.299) */ |
shadow-purple-100 | --tw-shadow-color var(--color-purple-100); /* oklch(94.6% 0.033 307.174) */ |
shadow-purple-200 | --tw-shadow-color var(--color-purple-200); /* oklch(90.2% 0.063 306.703) */ |
shadow-purple-300 | --tw-shadow-color var(--color-purple-300); /* oklch(82.7% 0.119 306.383) */ |
shadow-purple-400 | --tw-shadow-color var(--color-purple-400); /* oklch(71.4% 0.203 305.504) */ |
shadow-purple-500 | --tw-shadow-color var(--color-purple-500); /* oklch(62.7% 0.265 303.9) */ |
shadow-purple-600 | --tw-shadow-color var(--color-purple-600); /* oklch(55.8% 0.288 302.321) */ |
shadow-purple-700 | --tw-shadow-color var(--color-purple-700); /* oklch(49.6% 0.265 301.924) */ |
shadow-purple-800 | --tw-shadow-color var(--color-purple-800); /* oklch(43.8% 0.218 303.724) */ |
shadow-purple-900 | --tw-shadow-color var(--color-purple-900); /* oklch(38.1% 0.176 304.987) */ |
shadow-purple-950 | --tw-shadow-color var(--color-purple-950); /* oklch(29.1% 0.149 302.717) */ |
shadow-fuchsia-50 | --tw-shadow-color var(--color-fuchsia-50); /* oklch(97.7% 0.017 320.058) */ |
shadow-fuchsia-100 | --tw-shadow-color var(--color-fuchsia-100); /* oklch(95.2% 0.037 318.852) */ |
shadow-fuchsia-200 | --tw-shadow-color var(--color-fuchsia-200); /* oklch(90.3% 0.076 319.62) */ |
shadow-fuchsia-300 | --tw-shadow-color var(--color-fuchsia-300); /* oklch(83.3% 0.145 321.434) */ |
shadow-fuchsia-400 | --tw-shadow-color var(--color-fuchsia-400); /* oklch(74% 0.238 322.16) */ |
shadow-fuchsia-500 | --tw-shadow-color var(--color-fuchsia-500); /* oklch(66.7% 0.295 322.15) */ |
shadow-fuchsia-600 | --tw-shadow-color var(--color-fuchsia-600); /* oklch(59.1% 0.293 322.896) */ |
shadow-fuchsia-700 | --tw-shadow-color var(--color-fuchsia-700); /* oklch(51.8% 0.253 323.949) */ |
shadow-fuchsia-800 | --tw-shadow-color var(--color-fuchsia-800); /* oklch(45.2% 0.211 324.591) */ |
shadow-fuchsia-900 | --tw-shadow-color var(--color-fuchsia-900); /* oklch(40.1% 0.17 325.612) */ |
shadow-fuchsia-950 | --tw-shadow-color var(--color-fuchsia-950); /* oklch(29.3% 0.136 325.661) */ |
shadow-pink-50 | --tw-shadow-color var(--color-pink-50); /* oklch(97.1% 0.014 343.198) */ |
shadow-pink-100 | --tw-shadow-color var(--color-pink-100); /* oklch(94.8% 0.028 342.258) */ |
shadow-pink-200 | --tw-shadow-color var(--color-pink-200); /* oklch(89.9% 0.061 343.231) */ |
shadow-pink-300 | --tw-shadow-color var(--color-pink-300); /* oklch(82.3% 0.12 346.018) */ |
shadow-pink-400 | --tw-shadow-color var(--color-pink-400); /* oklch(71.8% 0.202 349.761) */ |
shadow-pink-500 | --tw-shadow-color var(--color-pink-500); /* oklch(65.6% 0.241 354.308) */ |
shadow-pink-600 | --tw-shadow-color var(--color-pink-600); /* oklch(59.2% 0.249 0.584) */ |
shadow-pink-700 | --tw-shadow-color var(--color-pink-700); /* oklch(52.5% 0.223 3.958) */ |
shadow-pink-800 | --tw-shadow-color var(--color-pink-800); /* oklch(45.9% 0.187 3.815) */ |
shadow-pink-900 | --tw-shadow-color var(--color-pink-900); /* oklch(40.8% 0.153 2.432) */ |
shadow-pink-950 | --tw-shadow-color var(--color-pink-950); /* oklch(28.4% 0.109 3.907) */ |
shadow-rose-50 | --tw-shadow-color var(--color-rose-50); /* oklch(96.9% 0.015 12.422) */ |
shadow-rose-100 | --tw-shadow-color var(--color-rose-100); /* oklch(94.1% 0.03 12.58) */ |
shadow-rose-200 | --tw-shadow-color var(--color-rose-200); /* oklch(89.2% 0.058 10.001) */ |
shadow-rose-300 | --tw-shadow-color var(--color-rose-300); /* oklch(81% 0.117 11.638) */ |
shadow-rose-400 | --tw-shadow-color var(--color-rose-400); /* oklch(71.2% 0.194 13.428) */ |
shadow-rose-500 | --tw-shadow-color var(--color-rose-500); /* oklch(64.5% 0.246 16.439) */ |
shadow-rose-600 | --tw-shadow-color var(--color-rose-600); /* oklch(58.6% 0.253 17.585) */ |
shadow-rose-700 | --tw-shadow-color var(--color-rose-700); /* oklch(51.4% 0.222 16.935) */ |
shadow-rose-800 | --tw-shadow-color var(--color-rose-800); /* oklch(45.5% 0.188 13.697) */ |
shadow-rose-900 | --tw-shadow-color var(--color-rose-900); /* oklch(41% 0.159 10.272) */ |
shadow-rose-950 | --tw-shadow-color var(--color-rose-950); /* oklch(27.1% 0.105 12.094) */ |
shadow-slate-50 | --tw-shadow-color var(--color-slate-50); /* oklch(98.4% 0.003 247.858) */ |
shadow-slate-100 | --tw-shadow-color var(--color-slate-100); /* oklch(96.8% 0.007 247.896) */ |
shadow-slate-200 | --tw-shadow-color var(--color-slate-200); /* oklch(92.9% 0.013 255.508) */ |
shadow-slate-300 | --tw-shadow-color var(--color-slate-300); /* oklch(86.9% 0.022 252.894) */ |
shadow-slate-400 | --tw-shadow-color var(--color-slate-400); /* oklch(70.4% 0.04 256.788) */ |
shadow-slate-500 | --tw-shadow-color var(--color-slate-500); /* oklch(55.4% 0.046 257.417) */ |
shadow-slate-600 | --tw-shadow-color var(--color-slate-600); /* oklch(44.6% 0.043 257.281) */ |
shadow-slate-700 | --tw-shadow-color var(--color-slate-700); /* oklch(37.2% 0.044 257.287) */ |
shadow-slate-800 | --tw-shadow-color var(--color-slate-800); /* oklch(27.9% 0.041 260.031) */ |
shadow-slate-900 | --tw-shadow-color var(--color-slate-900); /* oklch(20.8% 0.042 265.755) */ |
shadow-slate-950 | --tw-shadow-color var(--color-slate-950); /* oklch(12.9% 0.042 264.695) */ |
shadow-gray-50 | --tw-shadow-color var(--color-gray-50); /* oklch(98.5% 0.002 247.839) */ |
shadow-gray-100 | --tw-shadow-color var(--color-gray-100); /* oklch(96.7% 0.003 264.542) */ |
shadow-gray-200 | --tw-shadow-color var(--color-gray-200); /* oklch(92.8% 0.006 264.531) */ |
shadow-gray-300 | --tw-shadow-color var(--color-gray-300); /* oklch(87.2% 0.01 258.338) */ |
shadow-gray-400 | --tw-shadow-color var(--color-gray-400); /* oklch(70.7% 0.022 261.325) */ |
shadow-gray-500 | --tw-shadow-color var(--color-gray-500); /* oklch(55.1% 0.027 264.364) */ |
shadow-gray-600 | --tw-shadow-color var(--color-gray-600); /* oklch(44.6% 0.03 256.802) */ |
shadow-gray-700 | --tw-shadow-color var(--color-gray-700); /* oklch(37.3% 0.034 259.733) */ |
shadow-gray-800 | --tw-shadow-color var(--color-gray-800); /* oklch(27.8% 0.033 256.848) */ |
shadow-gray-900 | --tw-shadow-color var(--color-gray-900); /* oklch(21% 0.034 264.665) */ |
shadow-gray-950 | --tw-shadow-color var(--color-gray-950); /* oklch(13% 0.028 261.692) */ |
shadow-zinc-50 | --tw-shadow-color var(--color-zinc-50); /* oklch(98.5% 0 0) */ |
shadow-zinc-100 | --tw-shadow-color var(--color-zinc-100); /* oklch(96.7% 0.001 286.375) */ |
shadow-zinc-200 | --tw-shadow-color var(--color-zinc-200); /* oklch(92% 0.004 286.32) */ |
shadow-zinc-300 | --tw-shadow-color var(--color-zinc-300); /* oklch(87.1% 0.006 286.286) */ |
shadow-zinc-400 | --tw-shadow-color var(--color-zinc-400); /* oklch(70.5% 0.015 286.067) */ |
shadow-zinc-500 | --tw-shadow-color var(--color-zinc-500); /* oklch(55.2% 0.016 285.938) */ |
shadow-zinc-600 | --tw-shadow-color var(--color-zinc-600); /* oklch(44.2% 0.017 285.786) */ |
shadow-zinc-700 | --tw-shadow-color var(--color-zinc-700); /* oklch(37% 0.013 285.805) */ |
shadow-zinc-800 | --tw-shadow-color var(--color-zinc-800); /* oklch(27.4% 0.006 286.033) */ |
shadow-zinc-900 | --tw-shadow-color var(--color-zinc-900); /* oklch(21% 0.006 285.885) */ |
shadow-zinc-950 | --tw-shadow-color var(--color-zinc-950); /* oklch(14.1% 0.005 285.823) */ |
shadow-neutral-50 | --tw-shadow-color var(--color-neutral-50); /* oklch(98.5% 0 0) */ |
shadow-neutral-100 | --tw-shadow-color var(--color-neutral-100); /* oklch(97% 0 0) */ |
shadow-neutral-200 | --tw-shadow-color var(--color-neutral-200); /* oklch(92.2% 0 0) */ |
shadow-neutral-300 | --tw-shadow-color var(--color-neutral-300); /* oklch(87% 0 0) */ |
shadow-neutral-400 | --tw-shadow-color var(--color-neutral-400); /* oklch(70.8% 0 0) */ |
shadow-neutral-500 | --tw-shadow-color var(--color-neutral-500); /* oklch(55.6% 0 0) */ |
shadow-neutral-600 | --tw-shadow-color var(--color-neutral-600); /* oklch(43.9% 0 0) */ |
shadow-neutral-700 | --tw-shadow-color var(--color-neutral-700); /* oklch(37.1% 0 0) */ |
shadow-neutral-800 | --tw-shadow-color var(--color-neutral-800); /* oklch(26.9% 0 0) */ |
shadow-neutral-900 | --tw-shadow-color var(--color-neutral-900); /* oklch(20.5% 0 0) */ |
shadow-neutral-950 | --tw-shadow-color var(--color-neutral-950); /* oklch(14.5% 0 0) */ |
shadow-stone-50 | --tw-shadow-color var(--color-stone-50); /* oklch(98.5% 0.001 106.423) */ |
shadow-stone-100 | --tw-shadow-color var(--color-stone-100); /* oklch(97% 0.001 106.424) */ |
shadow-stone-200 | --tw-shadow-color var(--color-stone-200); /* oklch(92.3% 0.003 48.717) */ |
shadow-stone-300 | --tw-shadow-color var(--color-stone-300); /* oklch(86.9% 0.005 56.366) */ |
shadow-stone-400 | --tw-shadow-color var(--color-stone-400); /* oklch(70.9% 0.01 56.259) */ |
shadow-stone-500 | --tw-shadow-color var(--color-stone-500); /* oklch(55.3% 0.013 58.071) */ |
shadow-stone-600 | --tw-shadow-color var(--color-stone-600); /* oklch(44.4% 0.011 73.639) */ |
shadow-stone-700 | --tw-shadow-color var(--color-stone-700); /* oklch(37.4% 0.01 67.558) */ |
shadow-stone-800 | --tw-shadow-color var(--color-stone-800); /* oklch(26.8% 0.007 34.298) */ |
shadow-stone-900 | --tw-shadow-color var(--color-stone-900); /* oklch(21.6% 0.006 56.043) */ |
shadow-stone-950 | --tw-shadow-color var(--color-stone-950); /* oklch(14.7% 0.004 49.25) */ |
使用类似 text-shadow-sm 和 shadow-lg 这样的工具类，将不同尺寸的文字阴影应用于文本元素
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
<p class="text-shadow-2xs ...">The quick brown fox...</p><p class="text-shadow-xs ...">The quick brown fox...</p><p class="text-shadow-sm ...">The quick brown fox...</p><p class="text-shadow-md ...">The quick brown fox...</p><p class="text-shadow-lg ...">The quick brown fox...</p>使用不透明度修饰符来调整文字阴影的不透明度
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
<p class="text-shadow-lg ...">The quick brown fox...</p><p class="text-shadow-lg/20 ...">The quick brown fox...</p><p class="text-shadow-lg/30 ...">The quick brown fox...</p>默认的文字阴影不透明度非常低（20% 或更低），因此增加不透明度（例如到 50%）将使文字阴影更加明显。
使用类似 text-shadow-indigo-500 和 text-shadow-cyan-500/50 这样的工具类来更改文字阴影的颜色
<button class="text-sky-950 text-shadow-2xs text-shadow-sky-300 ...">Book a demo</button><button class="text-gray-950 dark:text-white dark:text-shadow-2xs ...">See pricing</button>默认情况下，彩色阴影的不透明度为 100%，但您可以使用不透明度修饰符来调整它。
使用 text-shadow-none 工具类从元素中移除现有的文字阴影
<p class="text-shadow-lg dark:text-shadow-none"> <!-- ... --></p>使用 文字阴影-[<value>] 语法 来设置文字阴影基于完全自定义的值
<p class="text-shadow-[0_35px_35px_rgb(0_0_0_/_0.25)] ..."> Lorem ipsum dolor sit amet...</p>对于 CSS 变量，您还可以使用 文字阴影-(<custom-property>) 语法
<p class="text-shadow-(--my-text-shadow) ..."> Lorem ipsum dolor sit amet...</p>这只是 文字阴影-[var(<custom-property>)] 的简写形式，它会自动为您添加 var() 函数。
前缀一个 text-shadow 工具类 与断点变体（如 md:）一起使用，以仅在中等中等 屏幕尺寸及以上尺寸应用该工具类
<p class="text-shadow-none md:text-shadow-lg ..."> Lorem ipsum dolor sit amet...</p>在变体文档中了解更多关于使用变体的信息。
使用 --text-shadow-* 主题变量来自定义你的项目中的文字阴影 工具类
@theme { --text-shadow-xl: 0 35px 35px rgb(0, 0, 0 / 0.25); }现在 文字阴影-xl 工具类可以在你的标记中使用
<p class="text-shadow-xl"> Lorem ipsum dolor sit amet...</p>在 主题文档.
自定义阴影颜色color 工具类
@theme { --color-regal-blue: #243c5a; }现在 文字阴影-使用 工具类可以在你的标记中使用--color-* 主题变量来自定义
<p class="text-shadow-regal-blue"> Lorem ipsum dolor sit amet...</p>在 主题文档.