Nazwany kolor · #908A78
Cricket’s Cross
Cricket’s Cross to #908A78: rgb(144 138 120), hsl(45 10% 52%), oklch(0.634 0.027 91.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Cricket’s Cross color name →
#908A78
oklch(0.634 0.027 91.7)
Konwersje koloru
- HEX
- #908a78
- RGB
- rgb(144 138 120)
- HSL
- hsl(45 10% 52%)
- HWB
- hwb(45 47% 44%)
- OKLCH
- oklch(0.634 0.027 91.7)
- OKLab
- oklab(0.634 -0.001 0.027)
- CIE Lab
- lab(57.62 -0.06 10.53)
- LCH
- lch(57.62 10.53 90.3)
- CMYK
- cmyk(0% 4% 17% 44%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 9B9585
- A5A092
- B0AC9F
- BBB7AC
- C6C3B9
- D1CFC7
- DCDBD5
- E8E7E3
- F3F3F1
Odcienie ciemniejsze
- 7D7767
- 6A6557
- 575348
- 454239
- 34322A
- 24221D
- 151410
- 070705
- 010101
Tony
- 8E8979
- 8D887A
- 8B877B
- 8A867B
- 88857C
- 86847D
- 85837E
- 83827F
- 82817F
Harmonie kolorów
Komplementarna +180°
- 908A78
Cricket’s Cross
- 848A9B
≈ Yin Hūi Silver
Analogowa -30° +30°
- 908A78
Cricket’s Cross
- 97877A
≈ Toffee Fingers
- 878D7B
≈ Tea Leaf Mouse
Triada +120° +240°
- 908A78
Cricket’s Cross
- 788F94
≈ Weathered Pebble
- 948492
≈ Quixotic
Komplementarna rozszczepiona +150° +210°
- 908A78
Cricket’s Cross
- 7C8D99
≈ Denim Drift
- 8D8798
≈ Purple Ragwort
Tetrada +90° +180° +270°
- 908A78
Cricket’s Cross
- 79908B
≈ Northern Juniper
- 848A9B
≈ Yin Hūi Silver
- 998489
≈ Orchard Plum
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.44:1 · APCA Lc 62
Ag
AANa czerni
WCAG 6.09:1 · APCA Lc 40
Najlepszy kolor tekstu: #000000
WCAG 6.09:1 (AA) · APCA Lc 40
Contrast pairs
Fragmenty kodu
CSS
:root {
--cricket-s-cross: #908a78;
--cricket-s-cross-rgb: 144 138 120;
--cricket-s-cross-oklch: oklch(0.634 0.027 91.7);
}
.element {
color: var(--cricket-s-cross);
background-color: hsl(45 10% 52%);
border-color: oklch(0.634 0.027 91.7);
}Tailwind CSS v4
@theme {
--color-cricket-s-cross: #908a78;
--color-cricket-s-cross-50: #f8f5ed;
--color-cricket-s-cross-100: #ebe8de;
--color-cricket-s-cross-200: #d8d4c8;
--color-cricket-s-cross-300: #bcb7a8;
--color-cricket-s-cross-400: #a49e8d;
--color-cricket-s-cross-500: #8d8672;
--color-cricket-s-cross-600: #777161;
--color-cricket-s-cross-700: #5f5b4d;
--color-cricket-s-cross-800: #464238;
--color-cricket-s-cross-900: #302e26;
--color-cricket-s-cross-950: #1d1a15;
}SCSS
$cricket-s-cross: #908a78;
$cricket-s-cross-rgb: 144, 138, 120;
$cricket-s-cross-light: mix(#fff, $cricket-s-cross, 20%);
$cricket-s-cross-dark: mix(#000, $cricket-s-cross, 20%);
.element {
color: $cricket-s-cross;
box-shadow: 0 0 0 2px rgba($cricket-s-cross, 0.35);
}