Adlandırılmış renk · #BB8D3B
Trading Post
Trading Post, #BB8D3B: rgb(187 141 59), hsl(38 52% 48%), oklch(0.672 0.113 79). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Trading Post color name →
#BB8D3B
oklch(0.672 0.113 79)
Renk dönüşümleri
- HEX
- #bb8d3b
- RGB
- rgb(187 141 59)
- HSL
- hsl(38 52% 48%)
- HWB
- hwb(38 23% 27%)
- OKLCH
- oklch(0.672 0.113 79)
- OKLab
- oklab(0.672 0.021 0.111)
- CIE Lab
- lab(62.01 11.89 49.2)
- LCH
- lch(62.01 50.62 76.4)
- CMYK
- cmyk(0% 25% 68% 27%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C29852
- C9A467
- D0AF7A
- D7BA8D
- DDC6A0
- E4D1B3
- EBDCC6
- F2E8D9
- F8F3EC
Koyu tonlar
- A27A32
- 8A6729
- 735521
- 5C4419
- 463311
- 322309
- 1F1404
- 0D0701
- 020100
Gri tonlar
- B58C45
- AF8B4E
- A98A56
- A4895D
- 9E8764
- 98866A
- 928570
- 8C8376
- 86827B
Renk uyumları
Tamamlayıcı +180°
- BB8D3B
Trading Post
- 6B97DB
≈ Little Boy Blue
Analog -30° +30°
- BB8D3B
Trading Post
- CE8055
≈ Apricot Buff
- 9B9B41
≈ Be Yourself
Üçlü +120° +240°
- BB8D3B
Trading Post
- 0BAAB0
≈ Fiji
- B47FC2
≈ Lavender Sweater
Bölünmüş tamamlayıcı +150° +210°
- BB8D3B
Trading Post
- 39A3CD
≈ Skydome
- 948AD7
≈ Perrywinkle
Dörtlü +90° +180° +270°
- BB8D3B
Trading Post
- 3DAC8A
≈ Wells of Wonder
- 6B97DB
≈ Little Boy Blue
- C978A1
≈ Heartbreaker
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.00:1 · APCA Lc 57
Ag
AASiyah üzerinde
WCAG 6.98:1 · APCA Lc 45
En iyi metin rengi: #000000
WCAG 6.98:1 (AA) · APCA Lc 45
Contrast pairs
Kod parçacıkları
CSS
:root {
--trading-post: #bb8d3b;
--trading-post-rgb: 187 141 59;
--trading-post-oklch: oklch(0.672 0.113 79);
}
.element {
color: var(--trading-post);
background-color: hsl(38 52% 48%);
border-color: oklch(0.672 0.113 79);
}Tailwind CSS v4
@theme {
--color-trading-post: #bb8d3b;
--color-trading-post-50: #fff3d1;
--color-trading-post-100: #fce5be;
--color-trading-post-200: #edd09d;
--color-trading-post-300: #d5b273;
--color-trading-post-400: #c2964b;
--color-trading-post-500: #ae7c12;
--color-trading-post-600: #936915;
--color-trading-post-700: #765411;
--color-trading-post-800: #583c0a;
--color-trading-post-900: #3e2a06;
--color-trading-post-950: #271700;
}SCSS
$trading-post: #bb8d3b;
$trading-post-rgb: 187, 141, 59;
$trading-post-light: mix(#fff, $trading-post, 20%);
$trading-post-dark: mix(#000, $trading-post, 20%);
.element {
color: $trading-post;
box-shadow: 0 0 0 2px rgba($trading-post, 0.35);
}