Màu có tên · #FFCC88
Bastard Amber
Bastard Amber là #FFCC88: rgb(255 204 136), hsl(34 100% 77%), oklch(0.875 0.103 73.8). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Orange mean? → · Bastard Amber color name →
#FFCC88
oklch(0.875 0.103 73.8)
Chuyển đổi màu
- HEX
- #ffcc88
- RGB
- rgb(255 204 136)
- HSL
- hsl(34 100% 77%)
- HWB
- hwb(34 53% 0%)
- OKLCH
- oklch(0.875 0.103 73.8)
- OKLab
- oklab(0.875 0.029 0.099)
- CIE Lab
- lab(85.52 12.61 41)
- LCH
- lch(85.52 42.89 72.9)
- CMYK
- cmyk(0% 20% 47% 0%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- FFD195
- FFD7A1
- FFDCAD
- FFE1B9
- FFE6C5
- FFEBD1
- FFF0DC
- FFF5E8
- FFFAF4
Sắc đậm
- DEB175
- BE9763
- 9E7E52
- 806541
- 634E31
- 483722
- 2E2213
- 160F06
- 030201
Sắc xám
- F2C488
- E5BD88
- D8B588
- CBAD87
- BEA687
- B19E86
- A59784
- 988F83
- 8C8882
Hòa sắc
Bổ túc +180°
- FFCC88
Bastard Amber
- BAD9FF
≈ Broad Daylight
Tương đồng -30° +30°
- FFCC88
Bastard Amber
- FFC8B1
≈ Antique Coral
- E1DA88
≈ Dead Grass
Bộ ba +120° +240°
- FFCC88
Bastard Amber
- 7CECE9
≈ Dead Sea
- EBC5FF
≈ Aquarelle Lilac
Bổ túc chia +150° +210°
- FFCC88
Bastard Amber
- 97E3FF
≈ Winter Wizard
- D0D1FF
≈ Pale Phthalo Blue
Bộ bốn +90° +180° +270°
- FFCC88
Bastard Amber
- 93ECC4
≈ Nightly Aurora
- BAD9FF
≈ Broad Daylight
- FFC0E4
≈ Pretty in Pink
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.47:1 · APCA Lc 22
Ag
AAATrên nền đen
WCAG 14.24:1 · APCA Lc 81
Màu chữ tốt nhất: #000000
WCAG 14.24:1 (AAA) · APCA Lc 81
Contrast pairs
Đoạn mã
CSS
:root {
--bastard-amber: #ffcc88;
--bastard-amber-rgb: 255 204 136;
--bastard-amber-oklch: oklch(0.875 0.103 73.8);
}
.element {
color: var(--bastard-amber);
background-color: hsl(34 100% 77%);
border-color: oklch(0.875 0.103 73.8);
}Tailwind CSS v4
@theme {
--color-bastard-amber: #ffcc88;
--color-bastard-amber-50: #fff2d5;
--color-bastard-amber-100: #fce4c2;
--color-bastard-amber-200: #eecfa3;
--color-bastard-amber-300: #d6b17b;
--color-bastard-amber-400: #c39556;
--color-bastard-amber-500: #af7b2b;
--color-bastard-amber-600: #936827;
--color-bastard-amber-700: #76531f;
--color-bastard-amber-800: #583c15;
--color-bastard-amber-900: #3e290d;
--color-bastard-amber-950: #271702;
}SCSS
$bastard-amber: #ffcc88;
$bastard-amber-rgb: 255, 204, 136;
$bastard-amber-light: mix(#fff, $bastard-amber, 20%);
$bastard-amber-dark: mix(#000, $bastard-amber, 20%);
.element {
color: $bastard-amber;
box-shadow: 0 0 0 2px rgba($bastard-amber, 0.35);
}