Nazwany kolor · #FAF1DF
Cotton Whisper
Cotton Whisper to #FAF1DF: rgb(250 241 223), hsl(40 73% 93%), oklch(0.96 0.026 84.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Cotton Whisper color name →
#FAF1DF
oklch(0.96 0.026 84.6)
Konwersje koloru
- HEX
- #faf1df
- RGB
- rgb(250 241 223)
- HSL
- hsl(40 73% 93%)
- HWB
- hwb(40 87% 2%)
- OKLCH
- oklch(0.96 0.026 84.6)
- OKLab
- oklab(0.96 0.002 0.026)
- CIE Lab
- lab(95.5 0.92 9.86)
- LCH
- lch(95.5 9.9 84.7)
- CMYK
- cmyk(0% 4% 11% 2%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FBF2E2
- FBF4E5
- FCF5E9
- FCF7EC
- FDF8EF
- FDF9F2
- FEFBF5
- FEFCF9
- FFFEFC
Odcienie ciemniejsze
- D9D2C2
- BAB3A5
- 9B958A
- 7D796F
- 615D56
- 46433D
- 2D2B27
- 151412
- 030302
Tony
- EDE5D5
- E0D9CB
- D4CEC2
- C7C2B8
- BBB7AE
- AFACA5
- A3A19C
- 979692
- 8B8B89
Harmonie kolorów
Komplementarna +180°
- FAF1DF
Cotton Whisper
- ECF2FF
≈ Placebo Blue
Analogowa -30° +30°
- FAF1DF
Cotton Whisper
- FFEEE4
≈ Vanilla Blush
- F1F4E1
≈ Full Moon
Triada +120° +240°
- FAF1DF
Cotton Whisper
- DFF7FA
≈ Coastal Breeze
- FBECFC
≈ Placebo Pink
Komplementarna rozszczepiona +150° +210°
- FAF1DF
Cotton Whisper
- E4F5FF
≈ Kodama White
- F2F0FF
≈ Cloud Break
Tetrada +90° +180° +270°
- FAF1DF
Cotton Whisper
- E1F8F1
≈ Frosty Mint
- ECF2FF
≈ Placebo Blue
- FFECF3
≈ Fairy Wings
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.12:1 · APCA Lc 0
Ag
AAANa czerni
WCAG 18.71:1 · APCA Lc 99
Najlepszy kolor tekstu: #000000
WCAG 18.71:1 (AAA) · APCA Lc 99
Contrast pairs
Fragmenty kodu
CSS
:root {
--cotton-whisper: #faf1df;
--cotton-whisper-rgb: 250 241 223;
--cotton-whisper-oklch: oklch(0.96 0.026 84.6);
}
.element {
color: var(--cotton-whisper);
background-color: hsl(40 73% 93%);
border-color: oklch(0.96 0.026 84.6);
}Tailwind CSS v4
@theme {
--color-cotton-whisper: #faf1df;
--color-cotton-whisper-50: #f8f5ed;
--color-cotton-whisper-100: #ece7de;
--color-cotton-whisper-200: #d9d4c8;
--color-cotton-whisper-300: #bdb7a9;
--color-cotton-whisper-400: #a59e8e;
--color-cotton-whisper-500: #8e8573;
--color-cotton-whisper-600: #787162;
--color-cotton-whisper-700: #605a4e;
--color-cotton-whisper-800: #474238;
--color-cotton-whisper-900: #312d27;
--color-cotton-whisper-950: #1d1a15;
}SCSS
$cotton-whisper: #faf1df;
$cotton-whisper-rgb: 250, 241, 223;
$cotton-whisper-light: mix(#fff, $cotton-whisper, 20%);
$cotton-whisper-dark: mix(#000, $cotton-whisper, 20%);
.element {
color: $cotton-whisper;
box-shadow: 0 0 0 2px rgba($cotton-whisper, 0.35);
}