Benoemde kleur · #FFA03E
Hawaiian Passion
Hawaiian Passion is #FFA03E: rgb(255 160 62), hsl(30 100% 62%), oklch(0.786 0.156 62.3). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Orange mean? → · Hawaiian Passion color name →
#FFA03E
oklch(0.786 0.156 62.3)
Kleurconversies
- HEX
- #ffa03e
- RGB
- rgb(255 160 62)
- HSL
- hsl(30 100% 62%)
- HWB
- hwb(30 24% 0%)
- OKLCH
- oklch(0.786 0.156 62.3)
- OKLab
- oklab(0.786 0.073 0.138)
- CIE Lab
- lab(74.66 30.88 63.5)
- LCH
- lch(74.66 70.61 64.1)
- CMYK
- cmyk(0% 37% 76% 0%)
Tinten · Schaduwen · Tonen
Tinten
- FFAA58
- FFB46E
- FFBE82
- FFC895
- FFD1A7
- FFDAB9
- FFE4CB
- FFEDDC
- FFF6EE
Schaduwen
- DE8B35
- BE762B
- 9E6123
- 804E1A
- 633B12
- 48290A
- 2E1904
- 160901
- 030100
Tonen
- F29D4A
- E69B54
- D9985C
- CC9563
- C09269
- B38E6F
- A68B74
- 9A8878
- 8D847C
Kleurharmonieën
Complementair +180°
- FFA03E
Hawaiian Passion
- 70C2FF
≈ Maya Blue
Analoog -30° +30°
- FFA03E
Hawaiian Passion
- FF9A86
≈ Candy
- DDB51A
≈ Gold Tooth
Triadisch +120° +240°
- FFA03E
Hawaiian Passion
- 00D6C1
≈ Turquoise Panic
- C9A4FF
≈ Lilac
Gesplitst complementair +150° +210°
- FFA03E
Hawaiian Passion
- 00D0ED
≈ Picnic Day Sky
- A1B5FF
≈ Truesky Gloxym
Tetradisch +90° +180° +270°
- FFA03E
Hawaiian Passion
- 5ED587
≈ Spring Bouquet
- 70C2FF
≈ Maya Blue
- F391E5
≈ Diva Mecha
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.02:1 · APCA Lc 39
Ag
AAAOp zwart
WCAG 10.34:1 · APCA Lc 63
Beste tekstkleur: #000000
WCAG 10.34:1 (AAA) · APCA Lc 63
Contrast pairs
Codefragmenten
CSS
:root {
--hawaiian-passion: #ffa03e;
--hawaiian-passion-rgb: 255 160 62;
--hawaiian-passion-oklch: oklch(0.786 0.156 62.3);
}
.element {
color: var(--hawaiian-passion);
background-color: hsl(30 100% 62%);
border-color: oklch(0.786 0.156 62.3);
}Tailwind CSS v4
@theme {
--color-hawaiian-passion: #ffa03e;
--color-hawaiian-passion-50: #ffedc7;
--color-hawaiian-passion-100: #ffdeb2;
--color-hawaiian-passion-200: #ffc68d;
--color-hawaiian-passion-300: #efa55c;
--color-hawaiian-passion-400: #de8626;
--color-hawaiian-passion-500: #cc6800;
--color-hawaiian-passion-600: #ac5800;
--color-hawaiian-passion-700: #8a4700;
--color-hawaiian-passion-800: #683200;
--color-hawaiian-passion-900: #492200;
--color-hawaiian-passion-950: #301100;
}SCSS
$hawaiian-passion: #ffa03e;
$hawaiian-passion-rgb: 255, 160, 62;
$hawaiian-passion-light: mix(#fff, $hawaiian-passion, 20%);
$hawaiian-passion-dark: mix(#000, $hawaiian-passion, 20%);
.element {
color: $hawaiian-passion;
box-shadow: 0 0 0 2px rgba($hawaiian-passion, 0.35);
}