Colore con nome · #BABD6C
Kelly’s Flower
Kelly’s Flower è #BABD6C: rgb(186 189 108), hsl(62 38% 58%), oklch(0.778 0.104 110.4). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Kelly’s Flower color name →
#BABD6C
oklch(0.778 0.104 110.4)
Conversioni di colore
- HEX
- #babd6c
- RGB
- rgb(186 189 108)
- HSL
- hsl(62 38% 58%)
- HWB
- hwb(62 42% 26%)
- OKLCH
- oklch(0.778 0.104 110.4)
- OKLab
- oklab(0.778 -0.036 0.098)
- CIE Lab
- lab(75.02 -9.88 40.38)
- LCH
- lch(75.02 41.57 103.8)
- CMYK
- cmyk(2% 0% 43% 26%)
Tinte · Ombre · Toni
Tinte
- C1C47C
- C7CA8B
- CED19A
- D5D8A8
- DCDEB7
- E3E5C5
- EAEBD4
- F1F2E2
- F8F8F1
Ombre
- A1A45D
- 898C4E
- 727440
- 5C5D32
- 464725
- 323319
- 1E1F0D
- 0D0D04
- 020200
Toni
- B4B76F
- AEB172
- A8AB75
- A2A477
- 9C9E79
- 96987B
- 91927D
- 8B8C7E
- 86867F
Armonie di colore
Complementare +180°
- BABD6C
Kelly’s Flower
- B6ABF5
≈ Winterspring Lilac
Analogo -30° +30°
- BABD6C
Kelly’s Flower
- D9B066
≈ Stranglethorn Ochre
- 92C888
≈ Frenzy Plant
Triadico +120° +240°
- BABD6C
Kelly’s Flower
- 6AC3ED
≈ Blue Mana
- EA9BC0
≈ Shocking
Complementare divisa +150° +210°
- BABD6C
Kelly’s Flower
- 90B8FA
≈ Carolina Blue
- D5A1E0
≈ Herb Robert
Tetradico +90° +180° +270°
- BABD6C
Kelly’s Flower
- 57CBD1
≈ Watercourse
- B6ABF5
≈ Winterspring Lilac
- F29C9B
≈ Peach Burst
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.98:1 · APCA Lc 38
Ag
AAASu nero
WCAG 10.58:1 · APCA Lc 64
Miglior colore del testo: #000000
WCAG 10.58:1 (AAA) · APCA Lc 64
Contrast pairs
Frammenti di codice
CSS
:root {
--kelly-s-flower: #babd6c;
--kelly-s-flower-rgb: 186 189 108;
--kelly-s-flower-oklch: oklch(0.778 0.104 110.4);
}
.element {
color: var(--kelly-s-flower);
background-color: hsl(62 38% 58%);
border-color: oklch(0.778 0.104 110.4);
}Tailwind CSS v4
@theme {
--color-kelly-s-flower: #babd6c;
--color-kelly-s-flower-50: #f5f9d7;
--color-kelly-s-flower-100: #e8ecc5;
--color-kelly-s-flower-200: #d4d9a6;
--color-kelly-s-flower-300: #b8bd7f;
--color-kelly-s-flower-400: #a1a458;
--color-kelly-s-flower-500: #8a8c2f;
--color-kelly-s-flower-600: #757629;
--color-kelly-s-flower-700: #5d5f21;
--color-kelly-s-flower-800: #464515;
--color-kelly-s-flower-900: #30300d;
--color-kelly-s-flower-950: #1d1c02;
}SCSS
$kelly-s-flower: #babd6c;
$kelly-s-flower-rgb: 186, 189, 108;
$kelly-s-flower-light: mix(#fff, $kelly-s-flower, 20%);
$kelly-s-flower-dark: mix(#000, $kelly-s-flower, 20%);
.element {
color: $kelly-s-flower;
box-shadow: 0 0 0 2px rgba($kelly-s-flower, 0.35);
}