Nazwany kolor · #FEB308
Dithered Amber
Dithered Amber to #FEB308: rgb(254 179 8), hsl(42 99% 51%), oklch(0.817 0.169 78.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Dithered Amber color name →
#FEB308
oklch(0.817 0.169 78.1)
Konwersje koloru
- HEX
- #feb308
- RGB
- rgb(254 179 8)
- HSL
- hsl(42 99% 51%)
- HWB
- hwb(42 3% 0%)
- OKLCH
- oklch(0.817 0.169 78.1)
- OKLab
- oklab(0.817 0.035 0.166)
- CIE Lab
- lab(78.68 20.19 80.1)
- LCH
- lch(78.68 82.6 75.9)
- CMYK
- cmyk(0% 30% 97% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FFBB41
- FFC35F
- FFCB77
- FFD38D
- FFDBA1
- FFE2B4
- FFE9C7
- FFF1DA
- FFF8ED
Odcienie ciemniejsze
- DD9B06
- BD8404
- 9E6E03
- 805802
- 634301
- 472F01
- 2D1D00
- 160C00
- 030100
Tony
- F1AE30
- E4AA42
- D7A550
- CBA05A
- BE9B63
- B2966A
- A59071
- 998B76
- 8C867C
Harmonie kolorów
Komplementarna +180°
- FEB308
Dithered Amber
- 9EC5FF
≈ Pastel Blue
Analogowa -30° +30°
- FEB308
Dithered Amber
- FFAD82
≈ Spice Pink
- CECA22
≈ Lime Pop
Triada +120° +240°
- FEB308
Dithered Amber
- 00DEE4
≈ Fish Boy
- EAA4FF
≈ Rich Brilliant Lavender
Komplementarna rozszczepiona +150° +210°
- FEB308
Dithered Amber
- 66D2FF
≈ Heisenberg Blue
- C0B9FF
≈ Dried Lilac
Tetrada +90° +180° +270°
- FEB308
Dithered Amber
- 00E4AF
≈ Overchlorinated Pool
- 9EC5FF
≈ Pastel Blue
- FFA1D1
≈ Corinthian Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.80:1 · APCA Lc 33
Ag
AAANa czerni
WCAG 11.66:1 · APCA Lc 70
Najlepszy kolor tekstu: #000000
WCAG 11.66:1 (AAA) · APCA Lc 70
Contrast pairs
Fragmenty kodu
CSS
:root {
--dithered-amber: #feb308;
--dithered-amber-rgb: 254 179 8;
--dithered-amber-oklch: oklch(0.817 0.169 78.1);
}
.element {
color: var(--dithered-amber);
background-color: hsl(42 99% 51%);
border-color: oklch(0.817 0.169 78.1);
}Tailwind CSS v4
@theme {
--color-dithered-amber: #feb308;
--color-dithered-amber-50: #fff1bf;
--color-dithered-amber-100: #ffe2a7;
--color-dithered-amber-200: #facc7e;
--color-dithered-amber-300: #e4ad44;
--color-dithered-amber-400: #d48f00;
--color-dithered-amber-500: #c17200;
--color-dithered-amber-600: #a36100;
--color-dithered-amber-700: #834d00;
--color-dithered-amber-800: #623700;
--color-dithered-amber-900: #452600;
--color-dithered-amber-950: #2d1400;
}SCSS
$dithered-amber: #feb308;
$dithered-amber-rgb: 254, 179, 8;
$dithered-amber-light: mix(#fff, $dithered-amber, 20%);
$dithered-amber-dark: mix(#000, $dithered-amber, 20%);
.element {
color: $dithered-amber;
box-shadow: 0 0 0 2px rgba($dithered-amber, 0.35);
}