Nazwany kolor · #D6B281
Jacob’s Ladder
Jacob’s Ladder to #D6B281: rgb(214 178 129), hsl(35 51% 67%), oklch(0.784 0.077 74.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Jacob’s Ladder color name →
#D6B281
oklch(0.784 0.077 74.8)
Konwersje koloru
- HEX
- #d6b281
- RGB
- rgb(214 178 129)
- HSL
- hsl(35 51% 67%)
- HWB
- hwb(35 51% 16%)
- OKLCH
- oklch(0.784 0.077 74.8)
- OKLab
- oklab(0.784 0.02 0.074)
- CIE Lab
- lab(74.96 8.59 30.21)
- LCH
- lch(74.96 31.4 74.1)
- CMYK
- cmyk(0% 17% 40% 16%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- DABA8E
- DEC19A
- E3C9A7
- E7D1B3
- EBD8C0
- EFE0CC
- F3E8D9
- F7EFE6
- FBF7F2
Odcienie ciemniejsze
- BA9A6F
- 9E835E
- 846D4E
- 6A573E
- 52432E
- 3B2F1F
- 251D12
- 100C06
- 020101
Tony
- CDAD81
- C4A882
- BCA382
- B39E82
- AA9982
- A29482
- 998F81
- 918A81
- 888581
Harmonie kolorów
Komplementarna +180°
- D6B281
Jacob’s Ladder
- 97BCEA
≈ Blue Shutters
Analogowa -30° +30°
- D6B281
Jacob’s Ladder
- E3A990
≈ Rose Tattoo
- C0BC82
≈ Krieg Khaki
Triada +120° +240°
- D6B281
Jacob’s Ladder
- 7BC8C8
≈ Pearl Bay
- CBAADB
≈ Cherish the Moment
Komplementarna rozszczepiona +150° +210°
- D6B281
Jacob’s Ladder
- 81C4DE
≈ Blue Charm
- B3B2E9
≈ Maximum Blue Purple
Tetrada +90° +180° +270°
- D6B281
Jacob’s Ladder
- 89C9AC
≈ Sybarite Green
- 97BCEA
≈ Blue Shutters
- DDA5C4
≈ Pink Beauty
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.99:1 · APCA Lc 38
Ag
AAANa czerni
WCAG 10.54:1 · APCA Lc 64
Najlepszy kolor tekstu: #000000
WCAG 10.54:1 (AAA) · APCA Lc 64
Contrast pairs
Fragmenty kodu
CSS
:root {
--jacob-s-ladder: #d6b281;
--jacob-s-ladder-rgb: 214 178 129;
--jacob-s-ladder-oklch: oklch(0.784 0.077 74.8);
}
.element {
color: var(--jacob-s-ladder);
background-color: hsl(35 51% 67%);
border-color: oklch(0.784 0.077 74.8);
}Tailwind CSS v4
@theme {
--color-jacob-s-ladder: #d6b281;
--color-jacob-s-ladder-50: #fff3dd;
--color-jacob-s-ladder-100: #f7e5cc;
--color-jacob-s-ladder-200: #e7d1b0;
--color-jacob-s-ladder-300: #ceb38b;
--color-jacob-s-ladder-400: #b9986b;
--color-jacob-s-ladder-500: #a47f49;
--color-jacob-s-ladder-600: #8b6b3f;
--color-jacob-s-ladder-700: #6f5632;
--color-jacob-s-ladder-800: #533e23;
--color-jacob-s-ladder-900: #3a2b17;
--color-jacob-s-ladder-950: #241808;
}SCSS
$jacob-s-ladder: #d6b281;
$jacob-s-ladder-rgb: 214, 178, 129;
$jacob-s-ladder-light: mix(#fff, $jacob-s-ladder, 20%);
$jacob-s-ladder-dark: mix(#000, $jacob-s-ladder, 20%);
.element {
color: $jacob-s-ladder;
box-shadow: 0 0 0 2px rgba($jacob-s-ladder, 0.35);
}