Nazwany kolor · #BDB298
Clay Pebble
Clay Pebble to #BDB298: rgb(189 178 152), hsl(42 22% 67%), oklch(0.766 0.038 87.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Clay Pebble color name →
#BDB298
oklch(0.766 0.038 87.8)
Konwersje koloru
- HEX
- #bdb298
- RGB
- rgb(189 178 152)
- HSL
- hsl(42 22% 67%)
- HWB
- hwb(42 60% 26%)
- OKLCH
- oklch(0.766 0.038 87.8)
- OKLab
- oklab(0.766 0.001 0.038)
- CIE Lab
- lab(72.99 0.88 14.84)
- LCH
- lch(72.99 14.86 86.6)
- CMYK
- cmyk(0% 6% 20% 26%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C3BAA2
- CAC1AC
- D0C9B6
- D7D0C0
- DED8CB
- E4E0D5
- EBE7DF
- F2EFEA
- F8F7F4
Odcienie ciemniejsze
- A49A84
- 8C8370
- 746D5C
- 5D574A
- 474338
- 332F27
- 1F1D17
- 0D0C08
- 020101
Tony
- B7AD96
- B0A893
- AAA391
- A49E8F
- 9E998C
- 98948A
- 928F87
- 8C8A85
- 868582
Harmonie kolorów
Komplementarna +180°
- BDB298
Clay Pebble
- A8B3CC
≈ Kentucky Blue
Analogowa -30° +30°
- BDB298
Clay Pebble
- C6AD9C
≈ California Stucco
- B0B79C
≈ Foille
Triada +120° +240°
- BDB298
Clay Pebble
- 98BABF
≈ Casual Day
- C1ABBF
≈ Monet Magic
Komplementarna rozszczepiona +150° +210°
- BDB298
Clay Pebble
- 9DB7C9
≈ Country Air
- B5AEC9
≈ Lavender Dream
Tetrada +90° +180° +270°
- BDB298
Clay Pebble
- 9ABBB3
≈ Lap Pool Blue
- A8B3CC
≈ Kentucky Blue
- C8A9B3
≈ Dutchess Dawn
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.10:1 · APCA Lc 41
Ag
AAANa czerni
WCAG 9.98:1 · APCA Lc 61
Najlepszy kolor tekstu: #000000
WCAG 9.98:1 (AAA) · APCA Lc 61
Contrast pairs
Fragmenty kodu
CSS
:root {
--clay-pebble: #bdb298;
--clay-pebble-rgb: 189 178 152;
--clay-pebble-oklch: oklch(0.766 0.038 87.8);
}
.element {
color: var(--clay-pebble);
background-color: hsl(42 22% 67%);
border-color: oklch(0.766 0.038 87.8);
}Tailwind CSS v4
@theme {
--color-clay-pebble: #bdb298;
--color-clay-pebble-50: #f9f5e9;
--color-clay-pebble-100: #ede8da;
--color-clay-pebble-200: #dad4c2;
--color-clay-pebble-300: #bfb7a2;
--color-clay-pebble-400: #a89e85;
--color-clay-pebble-500: #91856a;
--color-clay-pebble-600: #7a715a;
--color-clay-pebble-700: #625a48;
--color-clay-pebble-800: #484233;
--color-clay-pebble-900: #322d23;
--color-clay-pebble-950: #1e1a12;
}SCSS
$clay-pebble: #bdb298;
$clay-pebble-rgb: 189, 178, 152;
$clay-pebble-light: mix(#fff, $clay-pebble, 20%);
$clay-pebble-dark: mix(#000, $clay-pebble, 20%);
.element {
color: $clay-pebble;
box-shadow: 0 0 0 2px rgba($clay-pebble, 0.35);
}