Nazwany kolor · #CEB993
Palmetto Bluff
Palmetto Bluff to #CEB993: rgb(206 185 147), hsl(39 38% 69%), oklch(0.794 0.056 82.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Palmetto Bluff color name →
#CEB993
oklch(0.794 0.056 82.3)
Konwersje koloru
- HEX
- #ceb993
- RGB
- rgb(206 185 147)
- HSL
- hsl(39 38% 69%)
- HWB
- hwb(39 58% 19%)
- OKLCH
- oklch(0.794 0.056 82.3)
- OKLab
- oklab(0.794 0.008 0.056)
- CIE Lab
- lab(76.24 3.49 22.24)
- LCH
- lch(76.24 22.51 81.1)
- CMYK
- cmyk(0% 10% 29% 19%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D3C09E
- D8C7A8
- DDCEB3
- E2D5BE
- E6DCC9
- EBE3D3
- F0EADE
- F5F1E9
- FAF8F4
Odcienie ciemniejsze
- B3A07F
- 98896C
- 7F7159
- 665B47
- 4E4636
- 383125
- 231E16
- 0F0D08
- 020201
Tony
- C6B391
- BEAD90
- B6A88E
- AEA28C
- A69C8A
- 9E9788
- 979186
- 8F8B84
- 888682
Harmonie kolorów
Komplementarna +180°
- CEB993
Palmetto Bluff
- A8BDE1
≈ Artesian Pool
Analogowa -30° +30°
- CEB993
Palmetto Bluff
- DAB29B
≈ Spanish Villa
- BCC097
≈ Beige and Sage
Triada +120° +240°
- CEB993
Palmetto Bluff
- 91C7CB
≈ Cerulean Skies
- CEB0D2
≈ Windsor Purple
Komplementarna rozszczepiona +150° +210°
- CEB993
Palmetto Bluff
- 98C3DA
≈ Madras Blue
- BCB6DE
≈ Moonraker
Tetrada +90° +180° +270°
- CEB993
Palmetto Bluff
- 97C8B8
≈ Cool Juniper
- A8BDE1
≈ Artesian Pool
- DAADBF
≈ Apple Infusion
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.91:1 · APCA Lc 36
Ag
AAANa czerni
WCAG 10.98:1 · APCA Lc 66
Najlepszy kolor tekstu: #000000
WCAG 10.98:1 (AAA) · APCA Lc 66
Contrast pairs
Fragmenty kodu
CSS
:root {
--palmetto-bluff: #ceb993;
--palmetto-bluff-rgb: 206 185 147;
--palmetto-bluff-oklch: oklch(0.794 0.056 82.3);
}
.element {
color: var(--palmetto-bluff);
background-color: hsl(39 38% 69%);
border-color: oklch(0.794 0.056 82.3);
}Tailwind CSS v4
@theme {
--color-palmetto-bluff: #ceb993;
--color-palmetto-bluff-50: #fdf4e3;
--color-palmetto-bluff-100: #f1e7d3;
--color-palmetto-bluff-200: #e0d3ba;
--color-palmetto-bluff-300: #c5b697;
--color-palmetto-bluff-400: #af9c79;
--color-palmetto-bluff-500: #99835b;
--color-palmetto-bluff-600: #816f4d;
--color-palmetto-bluff-700: #67593d;
--color-palmetto-bluff-800: #4d402c;
--color-palmetto-bluff-900: #352c1d;
--color-palmetto-bluff-950: #20190e;
}SCSS
$palmetto-bluff: #ceb993;
$palmetto-bluff-rgb: 206, 185, 147;
$palmetto-bluff-light: mix(#fff, $palmetto-bluff, 20%);
$palmetto-bluff-dark: mix(#000, $palmetto-bluff, 20%);
.element {
color: $palmetto-bluff;
box-shadow: 0 0 0 2px rgba($palmetto-bluff, 0.35);
}