Nazwany kolor · #AB8953
Teak
Teak to #AB8953: rgb(171 137 83), hsl(37 35% 50%), oklch(0.65 0.083 78.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Teak color name →
#AB8953
oklch(0.65 0.083 78.1)
Konwersje koloru
- HEX
- #ab8953
- RGB
- rgb(171 137 83)
- HSL
- hsl(37 35% 50%)
- HWB
- hwb(37 33% 33%)
- OKLCH
- oklch(0.65 0.083 78.1)
- OKLab
- oklab(0.65 0.017 0.081)
- CIE Lab
- lab(59.45 8.34 33.92)
- LCH
- lch(59.45 34.93 76.2)
- CMYK
- cmyk(0% 20% 51% 33%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B39464
- BCA075
- C4AC86
- CCB797
- D5C3A8
- DDCFB9
- E6DBCB
- EEE7DC
- F7F3ED
Odcienie ciemniejsze
- 947647
- 7E643B
- 685330
- 544225
- 40311B
- 2D2211
- 1B1408
- 0B0702
- 010100
Tony
- A78859
- A2885E
- 9E8763
- 9A8667
- 96856C
- 918470
- 8D8374
- 898278
- 84817C
Harmonie kolorów
Komplementarna +180°
- AB8953
Teak
- 7091C2
≈ Cornflower Blue
Analogowa -30° +30°
Triada +120° +240°
- AB8953
Teak
- 489FA1
≈ Aqua Fresco
- A57FB0
≈ Lobby Lilac
Komplementarna rozszczepiona +150° +210°
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.26:1 · APCA Lc 60
Ag
AANa czerni
WCAG 6.43:1 · APCA Lc 42
Najlepszy kolor tekstu: #000000
WCAG 6.43:1 (AA) · APCA Lc 42
Contrast pairs
Fragmenty kodu
CSS
:root {
--teak: #ab8953;
--teak-rgb: 171 137 83;
--teak-oklch: oklch(0.65 0.083 78.1);
}
.element {
color: var(--teak);
background-color: hsl(37 35% 50%);
border-color: oklch(0.65 0.083 78.1);
}Tailwind CSS v4
@theme {
--color-teak: #ab8953;
--color-teak-50: #fff3db;
--color-teak-100: #f7e6ca;
--color-teak-200: #e7d1ad;
--color-teak-300: #ceb387;
--color-teak-400: #b99965;
--color-teak-500: #a47f42;
--color-teak-600: #8b6c39;
--color-teak-700: #6f562d;
--color-teak-800: #533e20;
--color-teak-900: #3a2b15;
--color-teak-950: #241806;
}SCSS
$teak: #ab8953;
$teak-rgb: 171, 137, 83;
$teak-light: mix(#fff, $teak, 20%);
$teak-dark: mix(#000, $teak, 20%);
.element {
color: $teak;
box-shadow: 0 0 0 2px rgba($teak, 0.35);
}