Nazwany kolor · #DCDD65
Succulent Lime
Succulent Lime to #DCDD65: rgb(220 221 101), hsl(61 64% 63%), oklch(0.873 0.143 109.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Succulent Lime color name →
#DCDD65
oklch(0.873 0.143 109.5)
Konwersje koloru
- HEX
- #dcdd65
- RGB
- rgb(220 221 101)
- HSL
- hsl(61 64% 63%)
- HWB
- hwb(61 40% 13%)
- OKLCH
- oklch(0.873 0.143 109.5)
- OKLab
- oklab(0.873 -0.047 0.134)
- CIE Lab
- lab(86.28 -11.83 57.51)
- LCH
- lch(86.28 58.71 101.6)
- CMYK
- cmyk(0% 0% 54% 13%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- DFE178
- E3E489
- E6E899
- E9EBA9
- EDEFB8
- F0F2C6
- F4F5D5
- F8F9E3
- FBFCF1
Odcienie ciemniejsze
- BFC057
- A3A449
- 88883C
- 6E6E2F
- 545522
- 3C3D17
- 26260C
- 111103
- 020200
Tony
- D2D46B
- C9CA6F
- BFC173
- B6B777
- ACAE79
- A3A57C
- 9A9C7D
- 91927F
- 89897F
Harmonie kolorów
Komplementarna +180°
- DCDD65
Succulent Lime
- D4CFFF
≈ Pale Lavender
Analogowa -30° +30°
- DCDD65
Succulent Lime
- FFCC76
≈ Cheesus
- A3EC90
≈ Ulva Lactuca Green
Triada +120° +240°
- DCDD65
Succulent Lime
- 9FE0FF
≈ Columbia Blue
- FFC0DD
≈ Cotton Candy
Komplementarna rozszczepiona +150° +210°
- DCDD65
Succulent Lime
- BDD7FF
≈ Oh Boy!
- F2C0FF
≈ Electric Lavender
Tetrada +90° +180° +270°
- DCDD65
Succulent Lime
- 2CF1F9
≈ Lightsaber Blue
- D4CFFF
≈ Pale Lavender
- FFC4C3
≈ Cinderella Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.44:1 · APCA Lc 21
Ag
AAANa czerni
WCAG 14.57:1 · APCA Lc 82
Najlepszy kolor tekstu: #000000
WCAG 14.57:1 (AAA) · APCA Lc 82
Contrast pairs
Fragmenty kodu
CSS
:root {
--succulent-lime: #dcdd65;
--succulent-lime-rgb: 220 221 101;
--succulent-lime-oklch: oklch(0.873 0.143 109.5);
}
.element {
color: var(--succulent-lime);
background-color: hsl(61 64% 63%);
border-color: oklch(0.873 0.143 109.5);
}Tailwind CSS v4
@theme {
--color-succulent-lime: #dcdd65;
--color-succulent-lime-50: #f6facb;
--color-succulent-lime-100: #e9edb6;
--color-succulent-lime-200: #d6db93;
--color-succulent-lime-300: #babf65;
--color-succulent-lime-400: #a5a52f;
--color-succulent-lime-500: #8e8c00;
--color-succulent-lime-600: #787700;
--color-succulent-lime-700: #605f00;
--color-succulent-lime-800: #484500;
--color-succulent-lime-900: #323000;
--color-succulent-lime-950: #1e1c00;
}SCSS
$succulent-lime: #dcdd65;
$succulent-lime-rgb: 220, 221, 101;
$succulent-lime-light: mix(#fff, $succulent-lime, 20%);
$succulent-lime-dark: mix(#000, $succulent-lime, 20%);
.element {
color: $succulent-lime;
box-shadow: 0 0 0 2px rgba($succulent-lime, 0.35);
}