色名 · #C5C2BE
Gallery Grey
Gallery Greyは#C5C2BE：rgb(197 194 190)、hsl(34 6% 76%)、oklch(0.815 0.006 75.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Gallery Grey color name →
#C5C2BE
oklch(0.815 0.006 75.4)
カラー変換
- HEX
- #c5c2be
- RGB
- rgb(197 194 190)
- HSL
- hsl(34 6% 76%)
- HWB
- hwb(34 75% 23%)
- OKLCH
- oklch(0.815 0.006 75.4)
- OKLab
- oklab(0.815 0.002 0.006)
- CIE Lab
- lab(78.59 0.55 2.41)
- LCH
- lch(78.59 2.47 77.2)
- CMYK
- cmyk(0% 2% 4% 23%)
ティント · シェード · トーン
ティント
- CBC8C4
- D0CECB
- D6D4D1
- DCDAD8
- E2E0DE
- E7E6E5
- EDECEB
- F3F3F2
- F9F9F8
シェード
- ABA8A5
- 928F8C
- 797775
- 61605E
- 4B4948
- 353433
- 21201F
- 0E0E0D
- 020202
トーン
- BEBBB8
- B7B4B1
- B0AEAB
- A9A7A5
- A2A09E
- 9B9A98
- 949392
- 8D8D8C
- 878686
カラーハーモニー
補色 +180°
- C5C2BE
Gallery Grey
- C0C3C7
≈ Pico Metal
類似色 -30° +30°
- C5C2BE
Gallery Grey
- C6C1BF
≈ Gallery Grey
- C3C3BE
≈ Grey Nickel
トライアド +120° +240°
- C5C2BE
Gallery Grey
- BEC4C4
≈ Foil
- C4C1C5
≈ Such Melodrama
スプリットコンプリメンタリー +150° +210°
- C5C2BE
Gallery Grey
- BEC3C6
≈ Metallic
- C2C2C7
≈ Pico Metal
テトラード +90° +180° +270°
- C5C2BE
Gallery Grey
- BFC4C1
≈ Silver Tipped Sage
- C0C3C7
≈ Pico Metal
- C6C1C3
≈ Such Melodrama
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.77:1 · APCA Lc 33
Ag
AAA黒の上
WCAG 11.83:1 · APCA Lc 70
最適な文字色: #000000
WCAG 11.83:1 (AAA) · APCA Lc 70
Contrast pairs
コードスニペット
CSS
:root {
--gallery-grey: #c5c2be;
--gallery-grey-rgb: 197 194 190;
--gallery-grey-oklch: oklch(0.815 0.006 75.4);
}
.element {
color: var(--gallery-grey);
background-color: hsl(34 6% 76%);
border-color: oklch(0.815 0.006 75.4);
}Tailwind CSS v4
@theme {
--color-gallery-grey: #c5c2be;
--color-gallery-grey-50: #f6f5f3;
--color-gallery-grey-100: #e9e7e5;
--color-gallery-grey-200: #d6d4d1;
--color-gallery-grey-300: #b9b7b4;
--color-gallery-grey-400: #a19e9a;
--color-gallery-grey-500: #898681;
--color-gallery-grey-600: #74716e;
--color-gallery-grey-700: #5c5a58;
--color-gallery-grey-800: #444240;
--color-gallery-grey-900: #2f2e2c;
--color-gallery-grey-950: #1b1a19;
}SCSS
$gallery-grey: #c5c2be;
$gallery-grey-rgb: 197, 194, 190;
$gallery-grey-light: mix(#fff, $gallery-grey, 20%);
$gallery-grey-dark: mix(#000, $gallery-grey, 20%);
.element {
color: $gallery-grey;
box-shadow: 0 0 0 2px rgba($gallery-grey, 0.35);
}