Cor nomeada · #CFD2B5
Pickling Spice
Pickling Spice é #CFD2B5: rgb(207 210 181), hsl(66 24% 77%), oklch(0.854 0.039 112). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Pickling Spice color name →
#CFD2B5
oklch(0.854 0.039 112)
Conversões de cor
- HEX
- #cfd2b5
- RGB
- rgb(207 210 181)
- HSL
- hsl(66 24% 77%)
- HWB
- hwb(66 71% 18%)
- OKLCH
- oklch(0.854 0.039 112)
- OKLab
- oklab(0.854 -0.015 0.036)
- CIE Lab
- lab(83.38 -4.76 14.08)
- LCH
- lch(83.38 14.86 108.7)
- CMYK
- cmyk(1% 0% 14% 18%)
Tons claros · Sombras · Tons
Tons claros
- D4D6BC
- D8DBC4
- DDDFCB
- E2E4D2
- E7E8DA
- ECEDE1
- F0F1E9
- F5F6F0
- FAFAF7
Sombras
- B4B69D
- 999B86
- 7F816F
- 676859
- 4F5044
- 383930
- 23241D
- 10100C
- 020202
Tons
- C7C9B0
- BFC1AA
- B7B9A5
- AFB0A0
- A7A89A
- 9FA095
- 979890
- 8F908A
- 888885
Harmonias de cor
Complementar +180°
- CFD2B5
Pickling Spice
- CFCBE7
≈ Foggy Plateau
Análoga -30° +30°
- CFD2B5
Pickling Spice
- DCCDB3
≈ Estate Limestone
- C1D6BE
≈ Surf Crest
Tríade +120° +240°
- CFD2B5
Pickling Spice
- B6D4E5
≈ Tiny Mr Frosty
- E5C5D2
≈ Pretty Pale
Complementar dividida +150° +210°
- CFD2B5
Pickling Spice
- C1D0E9
≈ Misty Mountains
- DCC7DF
≈ Grape Glimmer
Tétrade +90° +180° +270°
- CFD2B5
Pickling Spice
- B2D7DA
≈ Timeless
- CFCBE7
≈ Foggy Plateau
- E8C6C3
≈ Friends
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.55:1 · APCA Lc 25
Ag
AAASobre preto
WCAG 13.53:1 · APCA Lc 78
Melhor cor de texto: #000000
WCAG 13.53:1 (AAA) · APCA Lc 78
Contrast pairs
Trechos de código
CSS
:root {
--pickling-spice: #cfd2b5;
--pickling-spice-rgb: 207 210 181;
--pickling-spice-oklch: oklch(0.854 0.039 112);
}
.element {
color: var(--pickling-spice);
background-color: hsl(66 24% 77%);
border-color: oklch(0.854 0.039 112);
}Tailwind CSS v4
@theme {
--color-pickling-spice: #cfd2b5;
--color-pickling-spice-50: #f5f7ea;
--color-pickling-spice-100: #e7eadb;
--color-pickling-spice-200: #d4d6c4;
--color-pickling-spice-300: #b7baa3;
--color-pickling-spice-400: #9ea187;
--color-pickling-spice-500: #86896b;
--color-pickling-spice-600: #72745b;
--color-pickling-spice-700: #5b5d49;
--color-pickling-spice-800: #434434;
--color-pickling-spice-900: #2e2f23;
--color-pickling-spice-950: #1b1b12;
}SCSS
$pickling-spice: #cfd2b5;
$pickling-spice-rgb: 207, 210, 181;
$pickling-spice-light: mix(#fff, $pickling-spice, 20%);
$pickling-spice-dark: mix(#000, $pickling-spice, 20%);
.element {
color: $pickling-spice;
box-shadow: 0 0 0 2px rgba($pickling-spice, 0.35);
}