色名 · #824E78
Graphic Grape
Graphic Grapeは#824E78：rgb(130 78 120)、hsl(312 25% 41%)、oklch(0.498 0.091 334.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Graphic Grape color name →
#824E78
oklch(0.498 0.091 334.2)
カラー変換
- HEX
- #824e78
- RGB
- rgb(130 78 120)
- HSL
- hsl(312 25% 41%)
- HWB
- hwb(312 31% 49%)
- OKLCH
- oklch(0.498 0.091 334.2)
- OKLab
- oklab(0.498 0.082 -0.04)
- CIE Lab
- lab(40.52 27.4 -14.48)
- LCH
- lch(40.52 30.99 332.1)
- CMYK
- cmyk(0% 40% 8% 49%)
ティント · シェード · トーン
ティント
- 8F5F85
- 9B6F92
- A7819F
- B492AC
- C0A3BA
- CDB5C7
- D9C7D5
- E6DAE3
- F2ECF1
シェード
- 704367
- 5F3857
- 4E2D48
- 3E2339
- 2F192A
- 200F1D
- 120710
- 060205
- 010001
トーン
- 825379
- 82587A
- 835E7B
- 82637C
- 82687C
- 826D7D
- 82717E
- 81767F
- 817B7F
カラーハーモニー
補色 +180°
- 824E78
Graphic Grape
- 32724B
≈ Parsley Sprig
類似色 -30° +30°
- 824E78
Graphic Grape
- 6E558D
≈ Pure Mauve
- 8D4B5D
≈ Hawthorn Rose
トライアド +120° +240°
- 824E78
Graphic Grape
- 746119
≈ Brassy Brass
- 006F81
≈ Crystal Teal
スプリットコンプリメンタリー +150° +210°
- 824E78
Graphic Grape
- 586B2D
≈ Fig Leaf
- 007369
≈ Pharaoh’s Gem
テトラード +90° +180° +270°
- 824E78
Graphic Grape
- 865724
≈ Precious Copper
- 32724B
≈ Parsley Sprig
- 2F6893
≈ Summerday Blue
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.34:1 · APCA Lc 81
Ag
Fail黒の上
WCAG 3.31:1 · APCA Lc 20
最適な文字色: #FFFFFF
WCAG 6.34:1 (AA) · APCA Lc 81
Contrast pairs
コードスニペット
CSS
:root {
--graphic-grape: #824e78;
--graphic-grape-rgb: 130 78 120;
--graphic-grape-oklch: oklch(0.498 0.091 334.2);
}
.element {
color: var(--graphic-grape);
background-color: hsl(312 25% 41%);
border-color: oklch(0.498 0.091 334.2);
}Tailwind CSS v4
@theme {
--color-graphic-grape: #824e78;
--color-graphic-grape-50: #ffecff;
--color-graphic-grape-100: #fdddf4;
--color-graphic-grape-200: #eec6e3;
--color-graphic-grape-300: #d6a6c9;
--color-graphic-grape-400: #c08ab5;
--color-graphic-grape-500: #ab6f9f;
--color-graphic-grape-600: #905e86;
--color-graphic-grape-700: #744b6c;
--color-graphic-grape-800: #553650;
--color-graphic-grape-900: #3b2538;
--color-graphic-grape-950: #251422;
}SCSS
$graphic-grape: #824e78;
$graphic-grape-rgb: 130, 78, 120;
$graphic-grape-light: mix(#fff, $graphic-grape, 20%);
$graphic-grape-dark: mix(#000, $graphic-grape, 20%);
.element {
color: $graphic-grape;
box-shadow: 0 0 0 2px rgba($graphic-grape, 0.35);
}