Colore con nome · #FFB850
Carolling Candlelight
Carolling Candlelight è #FFB850: rgb(255 184 80), hsl(36 100% 66%), oklch(0.831 0.143 73.6). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Carolling Candlelight color name →
#FFB850
oklch(0.831 0.143 73.6)
Conversioni di colore
- HEX
- #ffb850
- RGB
- rgb(255 184 80)
- HSL
- hsl(36 100% 66%)
- HWB
- hwb(36 31% 0%)
- OKLCH
- oklch(0.831 0.143 73.6)
- OKLab
- oklab(0.831 0.04 0.138)
- CIE Lab
- lab(80.23 19.55 61.41)
- LCH
- lch(80.23 64.44 72.3)
- CMYK
- cmyk(0% 28% 69% 0%)
Tinte · Ombre · Toni
Tinte
- FFC066
- FFC77A
- FFCE8C
- FFD59E
- FFDDAF
- FFE4BF
- FFEBCF
- FFF1DF
- FFF8EF
Ombre
- DEA044
- BE8839
- 9E712E
- 805B24
- 63451A
- 483110
- 2E1E07
- 160C02
- 030200
Toni
- F2B359
- E5AD60
- D8A867
- CBA26C
- BF9D71
- B29775
- A59178
- 998C7B
- 8C867E
Armonie di colore
Complementare +180°
- FFB850
Carolling Candlelight
- A1CBFF
≈ Apocyan
Analogo -30° +30°
- FFB850
Carolling Candlelight
- FFB393
≈ Island Girl
- D8CB4F
≈ Advertisement Green
Triadico +120° +240°
- FFB850
Carolling Candlelight
- 00E4E2
≈ Bright Turquoise
- E4B0FF
≈ Mauve
Complementare divisa +150° +210°
- FFB850
Carolling Candlelight
- 67D8FF
≈ Heisenberg Blue
- C0C1FF
≈ Light Periwinkle
Tetradico +90° +180° +270°
- FFB850
Carolling Candlelight
- 5CE4AE
≈ Medium Aquamarine
- A1CBFF
≈ Apocyan
- FFA7DB
≈ Corinthian Pink
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.71:1 · APCA Lc 31
Ag
AAASu nero
WCAG 12.22:1 · APCA Lc 72
Miglior colore del testo: #000000
WCAG 12.22:1 (AAA) · APCA Lc 72
Contrast pairs
Frammenti di codice
CSS
:root {
--carolling-candlelight: #ffb850;
--carolling-candlelight-rgb: 255 184 80;
--carolling-candlelight-oklch: oklch(0.831 0.143 73.6);
}
.element {
color: var(--carolling-candlelight);
background-color: hsl(36 100% 66%);
border-color: oklch(0.831 0.143 73.6);
}Tailwind CSS v4
@theme {
--color-carolling-candlelight: #ffb850;
--color-carolling-candlelight-50: #fff0c8;
--color-carolling-candlelight-100: #ffe2b3;
--color-carolling-candlelight-200: #f8cc8e;
--color-carolling-candlelight-300: #e2ad5e;
--color-carolling-candlelight-400: #d09027;
--color-carolling-candlelight-500: #bd7300;
--color-carolling-candlelight-600: #a06200;
--color-carolling-candlelight-700: #804e00;
--color-carolling-candlelight-800: #603800;
--color-carolling-candlelight-900: #432600;
--color-carolling-candlelight-950: #2b1400;
}SCSS
$carolling-candlelight: #ffb850;
$carolling-candlelight-rgb: 255, 184, 80;
$carolling-candlelight-light: mix(#fff, $carolling-candlelight, 20%);
$carolling-candlelight-dark: mix(#000, $carolling-candlelight, 20%);
.element {
color: $carolling-candlelight;
box-shadow: 0 0 0 2px rgba($carolling-candlelight, 0.35);
}