Cor nomeada · #CFB4C2
Twilight Bloom
Twilight Bloom é #CFB4C2: rgb(207 180 194), hsl(329 22% 76%), oklch(0.797 0.036 345.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Pink mean? → · Twilight Bloom color name →
#CFB4C2
oklch(0.797 0.036 345.3)
Conversões de cor
- HEX
- #cfb4c2
- RGB
- rgb(207 180 194)
- HSL
- hsl(329 22% 76%)
- HWB
- hwb(329 71% 19%)
- OKLCH
- oklch(0.797 0.036 345.3)
- OKLab
- oklab(0.797 0.035 -0.009)
- CIE Lab
- lab(75.99 11.78 -3.36)
- LCH
- lch(75.99 12.25 344.1)
- CMYK
- cmyk(0% 13% 6% 19%)
Tons claros · Sombras · Tons
Tons claros
- D4BBC8
- D9C3CE
- DDCAD4
- E2D2DA
- E7D9E0
- ECE1E6
- F1E8EC
- F5F0F3
- FAF7F9
Sombras
- B49CA8
- 99858F
- 7F6E77
- 675860
- 4F4449
- 383034
- 231D20
- 100C0E
- 020202
Tons
- C7AFBB
- BFA9B4
- B7A4AE
- AF9FA7
- A79AA0
- 9F949A
- 978F93
- 8F8A8D
- 888586
Harmonias de cor
Complementar +180°
- CFB4C2
Twilight Bloom
- A8C5B7
≈ Kind Green
Análoga -30° +30°
- CFB4C2
Twilight Bloom
- C6B6CD
≈ Lavender Fog
- D3B4B5
≈ Rose Stain
Tríade +120° +240°
- CFB4C2
Twilight Bloom
- C0BFA4
≈ Mint Frost
- A5C2CF
≈ Drenched
Complementar dividida +150° +210°
- CFB4C2
Twilight Bloom
- B3C3AB
≈ Desolace Dew
- A3C5C4
≈ Raindrop
Tétrade +90° +180° +270°
- CFB4C2
Twilight Bloom
- CBBAA4
≈ Sail Grey
- A8C5B7
≈ Kind Green
- AEBED4
≈ Supremely Cool
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.91:1 · APCA Lc 37
Ag
AAASobre preto
WCAG 10.96:1 · APCA Lc 66
Melhor cor de texto: #000000
WCAG 10.96:1 (AAA) · APCA Lc 66
Contrast pairs
Trechos de código
CSS
:root {
--twilight-bloom: #cfb4c2;
--twilight-bloom-rgb: 207 180 194;
--twilight-bloom-oklch: oklch(0.797 0.036 345.3);
}
.element {
color: var(--twilight-bloom);
background-color: hsl(329 22% 76%);
border-color: oklch(0.797 0.036 345.3);
}Tailwind CSS v4
@theme {
--color-twilight-bloom: #cfb4c2;
--color-twilight-bloom-50: #fef1f7;
--color-twilight-bloom-100: #f2e3ea;
--color-twilight-bloom-200: #e1ced7;
--color-twilight-bloom-300: #c6b0bb;
--color-twilight-bloom-400: #af96a3;
--color-twilight-bloom-500: #997d8b;
--color-twilight-bloom-600: #816a76;
--color-twilight-bloom-700: #67555e;
--color-twilight-bloom-800: #4c3e46;
--color-twilight-bloom-900: #352a30;
--color-twilight-bloom-950: #20181c;
}SCSS
$twilight-bloom: #cfb4c2;
$twilight-bloom-rgb: 207, 180, 194;
$twilight-bloom-light: mix(#fff, $twilight-bloom, 20%);
$twilight-bloom-dark: mix(#000, $twilight-bloom, 20%);
.element {
color: $twilight-bloom;
box-shadow: 0 0 0 2px rgba($twilight-bloom, 0.35);
}