Adlandırılmış renk · #CADEA5
Butterfly
Butterfly, #CADEA5: rgb(202 222 165), hsl(81 46% 76%), oklch(0.871 0.078 123.7). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Butterfly color name →
#CADEA5
oklch(0.871 0.078 123.7)
Renk dönüşümleri
- HEX
- #cadea5
- RGB
- rgb(202 222 165)
- HSL
- hsl(81 46% 76%)
- HWB
- hwb(81 65% 13%)
- OKLCH
- oklch(0.871 0.078 123.7)
- OKLab
- oklab(0.871 -0.044 0.065)
- CIE Lab
- lab(85.9 -14.1 25.73)
- LCH
- lch(85.9 29.34 118.7)
- CMYK
- cmyk(9% 0% 26% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CFE1AE
- D4E5B7
- DAE8C0
- DFEBC9
- E4EFD2
- E9F2DB
- EFF5E4
- F4F9ED
- FAFCF6
Koyu tonlar
- AFC18F
- 95A579
- 7C8965
- 646F51
- 4D553D
- 373D2B
- 22261A
- 0F120A
- 020201
Gri tonlar
- C2D4A2
- BBCB9E
- B3C19A
- ACB797
- A4AE93
- 9DA58F
- 969B8C
- 8E9288
- 878984
Renk uyumları
Tamamlayıcı +180°
- CADEA5
Butterfly
- DFC9FF
≈ Foggy Heath
Analog -30° +30°
- CADEA5
Butterfly
- E6D499
≈ Lifeless Planet
- ADE4BD
≈ Fringy Flower
Üçlü +120° +240°
- CADEA5
Butterfly
- AFDBFF
≈ Droplet
- FFC1CF
≈ Garden Glory
Bölünmüş tamamlayıcı +150° +210°
- CADEA5
Butterfly
- C7D3FF
≈ Pale Phthalo Blue
- F5C2EB
≈ Purple’s Baby Sister
Dörtlü +90° +180° +270°
- CADEA5
Butterfly
- 97E3F4
≈ Blizzard Blue
- DFC9FF
≈ Foggy Heath
- FFC5B7
≈ Salmon Peach
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.44:1 · APCA Lc 21
Ag
AAASiyah üzerinde
WCAG 14.50:1 · APCA Lc 82
En iyi metin rengi: #000000
WCAG 14.50:1 (AAA) · APCA Lc 82
Contrast pairs
Kod parçacıkları
CSS
:root {
--butterfly: #cadea5;
--butterfly-rgb: 202 222 165;
--butterfly-oklch: oklch(0.871 0.078 123.7);
}
.element {
color: var(--butterfly);
background-color: hsl(81 46% 76%);
border-color: oklch(0.871 0.078 123.7);
}Tailwind CSS v4
@theme {
--color-butterfly: #cadea5;
--color-butterfly-50: #effae2;
--color-butterfly-100: #e1edd1;
--color-butterfly-200: #ccdbb7;
--color-butterfly-300: #adbf94;
--color-butterfly-400: #95a773;
--color-butterfly-500: #7c8f53;
--color-butterfly-600: #697947;
--color-butterfly-700: #546139;
--color-butterfly-800: #3e4727;
--color-butterfly-900: #2b311a;
--color-butterfly-950: #181d0b;
}SCSS
$butterfly: #cadea5;
$butterfly-rgb: 202, 222, 165;
$butterfly-light: mix(#fff, $butterfly, 20%);
$butterfly-dark: mix(#000, $butterfly, 20%);
.element {
color: $butterfly;
box-shadow: 0 0 0 2px rgba($butterfly, 0.35);
}