Nazwany kolor · #898A74
Sabiseiji Grey
Sabiseiji Grey to #898A74: rgb(137 138 116), hsl(63 9% 50%), oklch(0.626 0.032 109.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Sabiseiji Grey color name →
#898A74
oklch(0.626 0.032 109.4)
Konwersje koloru
- HEX
- #898a74
- RGB
- rgb(137 138 116)
- HSL
- hsl(63 9% 50%)
- HWB
- hwb(63 45% 46%)
- OKLCH
- oklch(0.626 0.032 109.4)
- OKLab
- oklab(0.626 -0.011 0.03)
- CIE Lab
- lab(56.92 -3.37 11.71)
- LCH
- lch(56.92 12.19 106)
- CMYK
- cmyk(1% 0% 16% 46%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 949581
- 9FA08E
- ABAC9C
- B7B7AA
- C2C3B7
- CECFC5
- DADBD4
- E6E7E2
- F3F3F0
Odcienie ciemniejsze
- 767764
- 646554
- 535345
- 424237
- 313229
- 22221B
- 14140F
- 070705
- 010101
Tony
- 888975
- 878877
- 868778
- 858679
- 84857A
- 84847B
- 83837D
- 82827E
- 81817F
Harmonie kolorów
Komplementarna +180°
- 898A74
Sabiseiji Grey
- 87859B
≈ Miracle
Analogowa -30° +30°
- 898A74
Sabiseiji Grey
- 938673
≈ Lunar Launch Site
- 7E8D7B
≈ Amazon Moss
Triada +120° +240°
- 898A74
Sabiseiji Grey
- 758C98
≈ Bluish Grey
- 98818B
≈ Toadstool Soup
Komplementarna rozszczepiona +150° +210°
- 898A74
Sabiseiji Grey
- 7D899C
≈ Window Screen
- 918294
≈ Purple Ash
Tetrada +90° +180° +270°
- 898A74
Sabiseiji Grey
- 728E8F
≈ Leisure Time
- 87859B
≈ Miracle
- 9B8180
≈ Mystere
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.52:1 · APCA Lc 63
Ag
AANa czerni
WCAG 5.95:1 · APCA Lc 39
Najlepszy kolor tekstu: #000000
WCAG 5.95:1 (AA) · APCA Lc 39
Contrast pairs
Fragmenty kodu
CSS
:root {
--sabiseiji-grey: #898a74;
--sabiseiji-grey-rgb: 137 138 116;
--sabiseiji-grey-oklch: oklch(0.626 0.032 109.4);
}
.element {
color: var(--sabiseiji-grey);
background-color: hsl(63 9% 50%);
border-color: oklch(0.626 0.032 109.4);
}Tailwind CSS v4
@theme {
--color-sabiseiji-grey: #898a74;
--color-sabiseiji-grey-50: #f5f6ec;
--color-sabiseiji-grey-100: #e8e9dd;
--color-sabiseiji-grey-200: #d4d6c6;
--color-sabiseiji-grey-300: #b7b9a7;
--color-sabiseiji-grey-400: #9fa08b;
--color-sabiseiji-grey-500: #878870;
--color-sabiseiji-grey-600: #72735f;
--color-sabiseiji-grey-700: #5c5c4c;
--color-sabiseiji-grey-800: #434337;
--color-sabiseiji-grey-900: #2e2e25;
--color-sabiseiji-grey-950: #1b1b14;
}SCSS
$sabiseiji-grey: #898a74;
$sabiseiji-grey-rgb: 137, 138, 116;
$sabiseiji-grey-light: mix(#fff, $sabiseiji-grey, 20%);
$sabiseiji-grey-dark: mix(#000, $sabiseiji-grey, 20%);
.element {
color: $sabiseiji-grey;
box-shadow: 0 0 0 2px rgba($sabiseiji-grey, 0.35);
}