Nazwany kolor · #BB4F35
Burnt Ochre
Burnt Ochre to #BB4F35: rgb(187 79 53), hsl(12 56% 47%), oklch(0.563 0.146 34.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Burnt Ochre color name →
#BB4F35
oklch(0.563 0.146 34.8)
Konwersje koloru
- HEX
- #bb4f35
- RGB
- rgb(187 79 53)
- HSL
- hsl(12 56% 47%)
- HWB
- hwb(12 21% 27%)
- OKLCH
- oklch(0.563 0.146 34.8)
- OKLab
- oklab(0.563 0.12 0.083)
- CIE Lab
- lab(48.11 43.31 37.64)
- LCH
- lch(48.11 57.38 41)
- CMYK
- cmyk(0% 58% 72% 27%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C4624A
- CC745E
- D48571
- DB9685
- E2A899
- E9B9AD
- EFCAC1
- F5DCD5
- FAEDEA
Odcienie ciemniejsze
- A2442D
- 8A3825
- 732E1D
- 5C2315
- 46190E
- 321008
- 1F0703
- 0D0201
- 020000
Tony
- B6563E
- B15C47
- AC614F
- A76656
- A16B5D
- 9B7065
- 95746C
- 8E7873
- 877C79
Harmonie kolorów
Komplementarna +180°
- BB4F35
Burnt Ochre
- 00849A
≈ Cruising
Analogowa -30° +30°
- BB4F35
Burnt Ochre
- B84A6A
≈ Pink Dahlia
- A76300
≈ Butter Fudge
Triada +120° +240°
- BB4F35
Burnt Ochre
- 008C4F
≈ Iceland Green
- 5E6BCA
≈ Borage Blue
Komplementarna rozszczepiona +150° +210°
- BB4F35
Burnt Ochre
- 00887D
≈ Mystic Turquoise
- 007BC2
≈ Star of Life
Tetrada +90° +180° +270°
- BB4F35
Burnt Ochre
- 638300
≈ Enchanted Forest
- 00849A
≈ Cruising
- 895CB9
≈ Lusty Lavender
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.90:1 · APCA Lc 73
Ag
FailNa czerni
WCAG 4.28:1 · APCA Lc 28
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.90:1 (AA) · APCA Lc 73
Contrast pairs
Fragmenty kodu
CSS
:root {
--burnt-ochre: #bb4f35;
--burnt-ochre-rgb: 187 79 53;
--burnt-ochre-oklch: oklch(0.563 0.146 34.8);
}
.element {
color: var(--burnt-ochre);
background-color: hsl(12 56% 47%);
border-color: oklch(0.563 0.146 34.8);
}Tailwind CSS v4
@theme {
--color-burnt-ochre: #bb4f35;
--color-burnt-ochre-50: #ffe8d8;
--color-burnt-ochre-100: #ffd8c6;
--color-burnt-ochre-200: #ffbfa8;
--color-burnt-ochre-300: #f89c82;
--color-burnt-ochre-400: #e77c62;
--color-burnt-ochre-500: #d55b3e;
--color-burnt-ochre-600: #b34e35;
--color-burnt-ochre-700: #903e2a;
--color-burnt-ochre-800: #6c2c1f;
--color-burnt-ochre-900: #4c1e14;
--color-burnt-ochre-950: #320d06;
}SCSS
$burnt-ochre: #bb4f35;
$burnt-ochre-rgb: 187, 79, 53;
$burnt-ochre-light: mix(#fff, $burnt-ochre, 20%);
$burnt-ochre-dark: mix(#000, $burnt-ochre, 20%);
.element {
color: $burnt-ochre;
box-shadow: 0 0 0 2px rgba($burnt-ochre, 0.35);
}