Benannte Farbe · #C4BEA8
Rippling Stone
Rippling Stone ist #C4BEA8: rgb(196 190 168), hsl(47 19% 71%), oklch(0.8 0.031 94.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Rippling Stone color name →
#C4BEA8
oklch(0.8 0.031 94.4)
Farbumrechnungen
- HEX
- #c4bea8
- RGB
- rgb(196 190 168)
- HSL
- hsl(47 19% 71%)
- HWB
- hwb(47 66% 23%)
- OKLCH
- oklch(0.8 0.031 94.4)
- OKLab
- oklab(0.8 -0.002 0.031)
- CIE Lab
- lab(77.02 -0.6 11.95)
- LCH
- lch(77.02 11.97 92.9)
- CMYK
- cmyk(0% 3% 14% 23%)
Tints · Shades · Tones
Tints
- CAC4B0
- D0CBB9
- D5D1C2
- DBD8CA
- E1DED3
- E7E5DC
- EDEBE4
- F3F2ED
- F9F8F6
Shades
- AAA592
- 918C7C
- 787567
- 615E52
- 4A483F
- 35332C
- 211F1A
- 0E0D0A
- 020201
Tones
- BDB8A4
- B6B1A0
- AFAB9C
- A8A598
- A19E94
- 9B9890
- 94928C
- 8D8C88
- 878684
Farbharmonien
Komplementär +180°
- C4BEA8
Rippling Stone
- B7BDD2
≈ Violet Vision
Analog -30° +30°
- C4BEA8
Rippling Stone
- CCBAAA
≈ Smoke Dragon
- B9C2AC
≈ Healing Retreat
Triadisch +120° +240°
- C4BEA8
Rippling Stone
- A8C3CA
≈ Skyward
- CBB7C6
≈ Ballad
Geteilt komplementär +150° +210°
- C4BEA8
Rippling Stone
- AEC1D1
≈ Ruffled Feathers
- C2B9CE
≈ Fog Syringa
Tetradisch +90° +180° +270°
- C4BEA8
Rippling Stone
- A9C5C0
≈ Peppermint Pie
- B7BDD2
≈ Violet Vision
- D0B6BB
≈ Rose Stain
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.86:1 · APCA Lc 35
Ag
AAAAuf Schwarz
WCAG 11.27:1 · APCA Lc 67
Beste Textfarbe: #000000
WCAG 11.27:1 (AAA) · APCA Lc 67
Contrast pairs
Code-Snippets
CSS
:root {
--rippling-stone: #c4bea8;
--rippling-stone-rgb: 196 190 168;
--rippling-stone-oklch: oklch(0.8 0.031 94.4);
}
.element {
color: var(--rippling-stone);
background-color: hsl(47 19% 71%);
border-color: oklch(0.8 0.031 94.4);
}Tailwind CSS v4
@theme {
--color-rippling-stone: #c4bea8;
--color-rippling-stone-50: #f7f5ec;
--color-rippling-stone-100: #ebe8dd;
--color-rippling-stone-200: #d8d4c6;
--color-rippling-stone-300: #bcb8a6;
--color-rippling-stone-400: #a49f8a;
--color-rippling-stone-500: #8d866f;
--color-rippling-stone-600: #77725e;
--color-rippling-stone-700: #5f5b4b;
--color-rippling-stone-800: #464236;
--color-rippling-stone-900: #302e25;
--color-rippling-stone-950: #1d1a14;
}SCSS
$rippling-stone: #c4bea8;
$rippling-stone-rgb: 196, 190, 168;
$rippling-stone-light: mix(#fff, $rippling-stone, 20%);
$rippling-stone-dark: mix(#000, $rippling-stone, 20%);
.element {
color: $rippling-stone;
box-shadow: 0 0 0 2px rgba($rippling-stone, 0.35);
}