Nazwany kolor · #C5AE7C
Butterbrot
Butterbrot to #C5AE7C: rgb(197 174 124), hsl(41 39% 63%), oklch(0.759 0.072 86). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Butterbrot color name →
#C5AE7C
oklch(0.759 0.072 86)
Konwersje koloru
- HEX
- #c5ae7c
- RGB
- rgb(197 174 124)
- HSL
- hsl(41 39% 63%)
- HWB
- hwb(41 49% 23%)
- OKLCH
- oklch(0.759 0.072 86)
- OKLab
- oklab(0.759 0.005 0.071)
- CIE Lab
- lab(72.22 3.31 28.92)
- LCH
- lch(72.22 29.11 83.5)
- CMYK
- cmyk(0% 12% 37% 23%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CBB689
- D0BE96
- D6C6A3
- DCCEB0
- E2D6BD
- E8DECA
- EDE6D7
- F3EFE5
- F9F7F2
Odcienie ciemniejsze
- AB976B
- 92805A
- 796A4A
- 61553B
- 4B412C
- 352E1E
- 211C11
- 0E0B05
- 020101
Tony
- BEA97D
- B7A57E
- B0A07E
- A99C7F
- A2977F
- 9B9280
- 948E80
- 8D8980
- 878580
Harmonie kolorów
Komplementarna +180°
- C5AE7C
Butterbrot
- 9BB0DF
≈ Blue Skies Today
Analogowa -30° +30°
- C5AE7C
Butterbrot
- D5A585
≈ Yolande
- AEB783
≈ Nile
Triada +120° +240°
- C5AE7C
Butterbrot
- 78BEC7
≈ Aqua Vitale
- C9A1C9
≈ Stormy Sunrise
Komplementarna rozszczepiona +150° +210°
- C5AE7C
Butterbrot
- 84B8D8
≈ 21st Century Blue
- B4A8DA
≈ Grape Illusion
Tetrada +90° +180° +270°
- C5AE7C
Butterbrot
- 7EC0AF
≈ Mintage
- 9BB0DF
≈ Blue Skies Today
- D79EB2
≈ Gizmo
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.16:1 · APCA Lc 42
Ag
AAANa czerni
WCAG 9.71:1 · APCA Lc 60
Najlepszy kolor tekstu: #000000
WCAG 9.71:1 (AAA) · APCA Lc 60
Contrast pairs
Fragmenty kodu
CSS
:root {
--butterbrot: #c5ae7c;
--butterbrot-rgb: 197 174 124;
--butterbrot-oklch: oklch(0.759 0.072 86);
}
.element {
color: var(--butterbrot);
background-color: hsl(41 39% 63%);
border-color: oklch(0.759 0.072 86);
}Tailwind CSS v4
@theme {
--color-butterbrot: #c5ae7c;
--color-butterbrot-50: #fef4df;
--color-butterbrot-100: #f2e7cd;
--color-butterbrot-200: #e1d3b2;
--color-butterbrot-300: #c7b68e;
--color-butterbrot-400: #b19c6d;
--color-butterbrot-500: #9b834c;
--color-butterbrot-600: #836f41;
--color-butterbrot-700: #695934;
--color-butterbrot-800: #4e4024;
--color-butterbrot-900: #362c18;
--color-butterbrot-950: #211909;
}SCSS
$butterbrot: #c5ae7c;
$butterbrot-rgb: 197, 174, 124;
$butterbrot-light: mix(#fff, $butterbrot, 20%);
$butterbrot-dark: mix(#000, $butterbrot, 20%);
.element {
color: $butterbrot;
box-shadow: 0 0 0 2px rgba($butterbrot, 0.35);
}