Couleur nommée · #C5CBE1
Periwinkle Powder
Periwinkle Powder correspond à #C5CBE1 : rgb(197 203 225), hsl(227 32% 83%), oklch(0.844 0.031 273.6). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Gray mean? → · Periwinkle Powder color name →
#C5CBE1
oklch(0.844 0.031 273.6)
Conversions de couleur
- HEX
- #c5cbe1
- RGB
- rgb(197 203 225)
- HSL
- hsl(227 32% 83%)
- HWB
- hwb(227 77% 12%)
- OKLCH
- oklch(0.844 0.031 273.6)
- OKLab
- oklab(0.844 0.002 -0.031)
- CIE Lab
- lab(81.73 1.11 -11.69)
- LCH
- lch(81.73 11.75 275.4)
- CMYK
- cmyk(12% 10% 0% 12%)
Teintes · Ombres · Tons
Teintes
- CBD0E4
- D0D5E7
- D6DAEA
- DCE0ED
- E2E5F0
- E7EAF3
- EDEFF6
- F3F4F9
- F9FAFC
Ombres
- ABB0C4
- 9296A7
- 797D8B
- 616570
- 4B4D56
- 35373E
- 212227
- 0E0F12
- 020202
Tons
- BEC3D7
- B7BCCD
- B0B4C3
- A9ACB9
- A2A5AF
- 9B9DA6
- 94969C
- 8D8F93
- 878789
Harmonies de couleurs
Complémentaire +180°
- C5CBE1
Periwinkle Powder
- D3CCB5
≈ Steamboat Geyser
Analogue -30° +30°
- C5CBE1
Periwinkle Powder
- BBCFDF
≈ Sky’s the Limit
- D0C7DD
≈ Angel Kiss
Triadique +120° +240°
- C5CBE1
Periwinkle Powder
- E0C5BF
≈ Golden Guernsey
- BDD2C3
≈ Spray of Mint
Complémentaire divisée +150° +210°
- C5CBE1
Periwinkle Powder
- DBC8B7
≈ Cocoa Cream
- C8D0BA
≈ Sweet Surrender
Tétradique +90° +180° +270°
- C5CBE1
Periwinkle Powder
- DFC4CA
≈ Bunny Pink
- D3CCB5
≈ Steamboat Geyser
- B6D3CE
≈ Malaysian Mist
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.61:1 · APCA Lc 28
Ag
AAASur noir
WCAG 13.00:1 · APCA Lc 75
Meilleure couleur de texte: #000000
WCAG 13.00:1 (AAA) · APCA Lc 75
Contrast pairs
Extraits de code
CSS
:root {
--periwinkle-powder: #c5cbe1;
--periwinkle-powder-rgb: 197 203 225;
--periwinkle-powder-oklch: oklch(0.844 0.031 273.6);
}
.element {
color: var(--periwinkle-powder);
background-color: hsl(227 32% 83%);
border-color: oklch(0.844 0.031 273.6);
}Tailwind CSS v4
@theme {
--color-periwinkle-powder: #c5cbe1;
--color-periwinkle-powder-50: #f2f5fe;
--color-periwinkle-powder-100: #e5e7f3;
--color-periwinkle-powder-200: #d0d3e2;
--color-periwinkle-powder-300: #b2b6c8;
--color-periwinkle-powder-400: #989eb1;
--color-periwinkle-powder-500: #7f859b;
--color-periwinkle-powder-600: #6c7183;
--color-periwinkle-powder-700: #565a69;
--color-periwinkle-powder-800: #3e424e;
--color-periwinkle-powder-900: #2b2d36;
--color-periwinkle-powder-950: #181a21;
}SCSS
$periwinkle-powder: #c5cbe1;
$periwinkle-powder-rgb: 197, 203, 225;
$periwinkle-powder-light: mix(#fff, $periwinkle-powder, 20%);
$periwinkle-powder-dark: mix(#000, $periwinkle-powder, 20%);
.element {
color: $periwinkle-powder;
box-shadow: 0 0 0 2px rgba($periwinkle-powder, 0.35);
}