Nazwany kolor · #D09B2C
Saffron Yellow
Saffron Yellow to #D09B2C: rgb(208 155 44), hsl(41 65% 49%), oklch(0.722 0.135 81.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Saffron Yellow color name →
#D09B2C
oklch(0.722 0.135 81.1)
Konwersje koloru
- HEX
- #d09b2c
- RGB
- rgb(208 155 44)
- HSL
- hsl(41 65% 49%)
- HWB
- hwb(41 17% 18%)
- OKLCH
- oklch(0.722 0.135 81.1)
- OKLab
- oklab(0.722 0.021 0.134)
- CIE Lab
- lab(67.79 13.26 61.64)
- LCH
- lch(67.79 63.05 77.9)
- CMYK
- cmyk(0% 25% 79% 18%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D5A54A
- DAAF62
- DFB977
- E4C38B
- E8CD9F
- EDD7B3
- F2E1C6
- F6EBD9
- FBF5EC
Odcienie ciemniejsze
- B58625
- 9A721E
- 805E17
- 674B11
- 4F390A
- 392805
- 231802
- 100901
- 020100
Tony
- C8993C
- C09648
- B89452
- B0915B
- A88F62
- A08C69
- 988970
- 908675
- 88837B
Harmonie kolorów
Komplementarna +180°
- D09B2C
Saffron Yellow
- 74A4FA
≈ Fennel Flower
Analogowa -30° +30°
- D09B2C
Saffron Yellow
- E78A50
≈ Autumn Glimmer
- A9AD3A
≈ Sphagnales Moss
Triada +120° +240°
- D09B2C
Saffron Yellow
- 00BBC5
≈ Panorama Blue
- CC87D8
≈ Blush Essence
Komplementarna rozszczepiona +150° +210°
- D09B2C
Saffron Yellow
- 2BB3EA
≈ Lynx Screen Blue
- A695F3
≈ Dull Lavender
Tetrada +90° +180° +270°
- D09B2C
Saffron Yellow
- 21C09A
≈ First Post
- 74A4FA
≈ Fennel Flower
- E47FAF
≈ Mangala Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.49:1 · APCA Lc 49
Ag
AAANa czerni
WCAG 8.40:1 · APCA Lc 53
Najlepszy kolor tekstu: #000000
WCAG 8.40:1 (AAA) · APCA Lc 53
Contrast pairs
Fragmenty kodu
CSS
:root {
--saffron-yellow: #d09b2c;
--saffron-yellow-rgb: 208 155 44;
--saffron-yellow-oklch: oklch(0.722 0.135 81.1);
}
.element {
color: var(--saffron-yellow);
background-color: hsl(41 65% 49%);
border-color: oklch(0.722 0.135 81.1);
}Tailwind CSS v4
@theme {
--color-saffron-yellow: #d09b2c;
--color-saffron-yellow-50: #fff3ca;
--color-saffron-yellow-100: #fee5b5;
--color-saffron-yellow-200: #f0d091;
--color-saffron-yellow-300: #d9b162;
--color-saffron-yellow-400: #c7952e;
--color-saffron-yellow-500: #b37a00;
--color-saffron-yellow-600: #976700;
--color-saffron-yellow-700: #795300;
--color-saffron-yellow-800: #5b3b00;
--color-saffron-yellow-900: #402900;
--color-saffron-yellow-950: #281600;
}SCSS
$saffron-yellow: #d09b2c;
$saffron-yellow-rgb: 208, 155, 44;
$saffron-yellow-light: mix(#fff, $saffron-yellow, 20%);
$saffron-yellow-dark: mix(#000, $saffron-yellow, 20%);
.element {
color: $saffron-yellow;
box-shadow: 0 0 0 2px rgba($saffron-yellow, 0.35);
}