Nazwany kolor · #BEA998
Snug as a Bug
Snug as a Bug to #BEA998: rgb(190 169 152), hsl(27 23% 67%), oklch(0.748 0.034 61.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Snug as a Bug color name →
#BEA998
oklch(0.748 0.034 61.3)
Konwersje koloru
- HEX
- #bea998
- RGB
- rgb(190 169 152)
- HSL
- hsl(27 23% 67%)
- HWB
- hwb(27 60% 25%)
- OKLCH
- oklch(0.748 0.034 61.3)
- OKLab
- oklab(0.748 0.016 0.03)
- CIE Lab
- lab(70.73 5.84 11.74)
- LCH
- lch(70.73 13.11 63.6)
- CMYK
- cmyk(0% 11% 20% 25%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- C4B1A2
- CBBAAC
- D1C2B6
- D8CBC0
- DED3CB
- E5DCD5
- EBE5DF
- F2EDEA
- F8F6F4
Odcienie ciemniejsze
- A59284
- 8C7C70
- 75675C
- 5E534A
- 483F38
- 332C27
- 1F1B17
- 0D0A08
- 020101
Tony
- B8A596
- B1A193
- AB9D91
- A5988E
- 9F948C
- 98908A
- 928C87
- 8C8885
- 868482
Harmonie kolorów
Komplementarna +180°
- BEA998
Snug as a Bug
- 9BB1C1
≈ Cloudless Day
Analogowa -30° +30°
- BEA998
Snug as a Bug
- C2A6A0
≈ Sable Cloaked
- B5AD95
≈ Bison Hide
Triada +120° +240°
- BEA998
Snug as a Bug
- 97B5AF
≈ Lake Forest
- B1A9C0
≈ Transparent Mauve
Komplementarna rozszczepiona +150° +210°
- BEA998
Snug as a Bug
- 95B4BA
≈ Mohair Soft Blue Grey
- A5ADC4
≈ Upscale
Tetrada +90° +180° +270°
- BEA998
Snug as a Bug
- 9EB4A3
≈ Copper Patina
- 9BB1C1
≈ Cloudless Day
- BBA6B7
≈ Pansy Posie
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.25:1 · APCA Lc 44
Ag
AAANa czerni
WCAG 9.31:1 · APCA Lc 58
Najlepszy kolor tekstu: #000000
WCAG 9.31:1 (AAA) · APCA Lc 58
Contrast pairs
Fragmenty kodu
CSS
:root {
--snug-as-a-bug: #bea998;
--snug-as-a-bug-rgb: 190 169 152;
--snug-as-a-bug-oklch: oklch(0.748 0.034 61.3);
}
.element {
color: var(--snug-as-a-bug);
background-color: hsl(27 23% 67%);
border-color: oklch(0.748 0.034 61.3);
}Tailwind CSS v4
@theme {
--color-snug-as-a-bug: #bea998;
--color-snug-as-a-bug-50: #fdf3eb;
--color-snug-as-a-bug-100: #f0e6dc;
--color-snug-as-a-bug-200: #dfd1c6;
--color-snug-as-a-bug-300: #c4b4a6;
--color-snug-as-a-bug-400: #ae9a8a;
--color-snug-as-a-bug-500: #97816f;
--color-snug-as-a-bug-600: #806e5f;
--color-snug-as-a-bug-700: #67584b;
--color-snug-as-a-bug-800: #4c4037;
--color-snug-as-a-bug-900: #342c25;
--color-snug-as-a-bug-950: #201914;
}SCSS
$snug-as-a-bug: #bea998;
$snug-as-a-bug-rgb: 190, 169, 152;
$snug-as-a-bug-light: mix(#fff, $snug-as-a-bug, 20%);
$snug-as-a-bug-dark: mix(#000, $snug-as-a-bug, 20%);
.element {
color: $snug-as-a-bug;
box-shadow: 0 0 0 2px rgba($snug-as-a-bug, 0.35);
}