Adlandırılmış renk · #C4C9E2
Silver Sweetpea
Silver Sweetpea, #C4C9E2: rgb(196 201 226), hsl(230 34% 83%), oklch(0.84 0.035 276.6). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Blue mean? → · Silver Sweetpea color name →
#C4C9E2
oklch(0.84 0.035 276.6)
Renk dönüşümleri
- HEX
- #c4c9e2
- RGB
- rgb(196 201 226)
- HSL
- hsl(230 34% 83%)
- HWB
- hwb(230 77% 11%)
- OKLCH
- oklch(0.84 0.035 276.6)
- OKLab
- oklab(0.84 0.004 -0.035)
- CIE Lab
- lab(81.16 1.92 -13.07)
- LCH
- lch(81.16 13.21 278.4)
- CMYK
- cmyk(13% 11% 0% 11%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CACEE5
- D0D4E8
- D5D9EB
- DBDEEE
- E1E4F1
- E7E9F4
- EDEFF6
- F3F4F9
- F9FAFC
Koyu tonlar
- AAAEC4
- 9195A8
- 787C8C
- 616471
- 4A4C57
- 35363E
- 212227
- 0E0F12
- 020203
Gri tonlar
- BDC1D8
- B6BACE
- AFB3C4
- A8ABBA
- A1A4B0
- 9B9DA6
- 94959C
- 8D8E93
- 878789
Renk uyumları
Tamamlayıcı +180°
- C4C9E2
Silver Sweetpea
- D1CBB1
≈ Platinum Sage
Analog -30° +30°
- C4C9E2
Silver Sweetpea
- B9CDE1
≈ Impressionist Sky
- D0C5DD
≈ Lavender Bliss
Üçlü +120° +240°
- C4C9E2
Silver Sweetpea
- E0C3BB
≈ Golden Guernsey
- B9D2C1
≈ Little Beaux Blue
Bölünmüş tamamlayıcı +150° +210°
- C4C9E2
Silver Sweetpea
- DBC7B3
≈ Playa Arenosa
- C4CFB7
≈ Tender Greens
Dörtlü +90° +180° +270°
- C4C9E2
Silver Sweetpea
- E0C2C7
≈ Odyssey Plum
- D1CBB1
≈ Platinum Sage
- B2D2CE
≈ Icy Morn
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.64:1 · APCA Lc 28
Ag
AAASiyah üzerinde
WCAG 12.80:1 · APCA Lc 74
En iyi metin rengi: #000000
WCAG 12.80:1 (AAA) · APCA Lc 74
Contrast pairs
Kod parçacıkları
CSS
:root {
--silver-sweetpea: #c4c9e2;
--silver-sweetpea-rgb: 196 201 226;
--silver-sweetpea-oklch: oklch(0.84 0.035 276.6);
}
.element {
color: var(--silver-sweetpea);
background-color: hsl(230 34% 83%);
border-color: oklch(0.84 0.035 276.6);
}Tailwind CSS v4
@theme {
--color-silver-sweetpea: #c4c9e2;
--color-silver-sweetpea-50: #f3f4ff;
--color-silver-sweetpea-100: #e5e7f4;
--color-silver-sweetpea-200: #d0d3e4;
--color-silver-sweetpea-300: #b3b6ca;
--color-silver-sweetpea-400: #999db4;
--color-silver-sweetpea-500: #80859e;
--color-silver-sweetpea-600: #6c7086;
--color-silver-sweetpea-700: #565a6b;
--color-silver-sweetpea-800: #3e424f;
--color-silver-sweetpea-900: #2b2d37;
--color-silver-sweetpea-950: #181a22;
}SCSS
$silver-sweetpea: #c4c9e2;
$silver-sweetpea-rgb: 196, 201, 226;
$silver-sweetpea-light: mix(#fff, $silver-sweetpea, 20%);
$silver-sweetpea-dark: mix(#000, $silver-sweetpea, 20%);
.element {
color: $silver-sweetpea;
box-shadow: 0 0 0 2px rgba($silver-sweetpea, 0.35);
}