Tailwind Fuchsia
The Tailwind Fuchsia shades with hex codes and contrast against white and black.
| Token | HEX | Contrast on white / black |
|---|---|---|
| fuchsia-50 | #fdf4ff |
1.07:1 / 19.56:1 |
| fuchsia-100 | #fae8ff |
1.16:1 / 18.05:1 |
| fuchsia-200 | #f6cfff |
1.37:1 / 15.28:1 |
| fuchsia-300 | #f4a8ff |
1.76:1 / 11.89:1 |
| fuchsia-400 | #ed6aff |
2.59:1 / 8.10:1 |
| fuchsia-500 | #e12afb |
3.54:1 / 5.92:1 |
| fuchsia-600 | #c800de |
4.65:1 / 4.51:1 |
| fuchsia-700 | #a800b7 |
6.27:1 / 3.34:1 |
| fuchsia-800 | #8a0194 |
8.35:1 / 2.51:1 |
| fuchsia-900 | #721378 |
10.09:1 / 2.07:1 |
| fuchsia-950 | #4b004f |
14.87:1 / 1.41:1 |
CSS variables
:root {
--color-fuchsia-50: #fdf4ff;
--color-fuchsia-100: #fae8ff;
--color-fuchsia-200: #f6cfff;
--color-fuchsia-300: #f4a8ff;
--color-fuchsia-400: #ed6aff;
--color-fuchsia-500: #e12afb;
--color-fuchsia-600: #c800de;
--color-fuchsia-700: #a800b7;
--color-fuchsia-800: #8a0194;
--color-fuchsia-900: #721378;
--color-fuchsia-950: #4b004f;
}
Open as palette Shades and tints