Adlandırılmış renk · #9A4E12
Burnt Bagel
Burnt Bagel, #9A4E12: rgb(154 78 18), hsl(26 79% 34%), oklch(0.509 0.121 52.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Brown mean? → · Burnt Bagel color name →
#9A4E12
oklch(0.509 0.121 52.5)
Renk dönüşümleri
- HEX
- #9a4e12
- RGB
- rgb(154 78 18)
- HSL
- hsl(26 79% 34%)
- HWB
- hwb(26 7% 40%)
- OKLCH
- oklch(0.509 0.121 52.5)
- OKLab
- oklab(0.509 0.074 0.096)
- CIE Lab
- lab(42.29 29.73 46.53)
- LCH
- lch(42.29 55.21 57.4)
- CMYK
- cmyk(0% 49% 88% 40%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A56031
- B07149
- BB825F
- C59476
- CFA58C
- D9B7A2
- E3C9B9
- ECDBD0
- F6EDE7
Koyu tonlar
- 85430E
- 71380A
- 5E2D07
- 4B2304
- 391902
- 270F01
- 170701
- 090200
- 010000
Gri tonlar
- 985424
- 965931
- 945F3D
- 926447
- 906951
- 8D6E5B
- 8A7365
- 87776E
- 847C77
Renk uyumları
Tamamlayıcı +180°
- 9A4E12
Burnt Bagel
- 006F97
≈ Tropic Sea
Analog -30° +30°
- 9A4E12
Burnt Bagel
- A04544
≈ Tandoori Spice
- 835F00
≈ Ground Earth
Üçlü +120° +240°
- 9A4E12
Burnt Bagel
- 007760
≈ Tropical Rainforest
- 6956A4
≈ Prophet Violet
Bölünmüş tamamlayıcı +150° +210°
- 9A4E12
Burnt Bagel
- 00747B
≈ Scurf Green
- 3E63AB
≈ Kakitsubata Blue
Dörtlü +90° +180° +270°
- 9A4E12
Burnt Bagel
- 367732
≈ Japanese Laurel
- 006F97
≈ Tropic Sea
- 864B8E
≈ Voodoo Violet
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 6.04:1 · APCA Lc 80
Ag
FailSiyah üzerinde
WCAG 3.47:1 · APCA Lc 22
En iyi metin rengi: #FFFFFF
WCAG 6.04:1 (AA) · APCA Lc 80
Contrast pairs
Kod parçacıkları
CSS
:root {
--burnt-bagel: #9a4e12;
--burnt-bagel-rgb: 154 78 18;
--burnt-bagel-oklch: oklch(0.509 0.121 52.5);
}
.element {
color: var(--burnt-bagel);
background-color: hsl(26 79% 34%);
border-color: oklch(0.509 0.121 52.5);
}Tailwind CSS v4
@theme {
--color-burnt-bagel: #9a4e12;
--color-burnt-bagel-50: #ffedd5;
--color-burnt-bagel-100: #ffdec2;
--color-burnt-bagel-200: #fec7a3;
--color-burnt-bagel-300: #e8a77b;
--color-burnt-bagel-400: #d78957;
--color-burnt-bagel-500: #c36c2e;
--color-burnt-bagel-600: #a55c29;
--color-burnt-bagel-700: #854920;
--color-burnt-bagel-800: #633417;
--color-burnt-bagel-900: #46240f;
--color-burnt-bagel-950: #2d1203;
}SCSS
$burnt-bagel: #9a4e12;
$burnt-bagel-rgb: 154, 78, 18;
$burnt-bagel-light: mix(#fff, $burnt-bagel, 20%);
$burnt-bagel-dark: mix(#000, $burnt-bagel, 20%);
.element {
color: $burnt-bagel;
box-shadow: 0 0 0 2px rgba($burnt-bagel, 0.35);
}