色名 · #A152BD
Royal Gramma Purple
Royal Gramma Purpleは#A152BD：rgb(161 82 189)、hsl(284 45% 53%)、oklch(0.578 0.174 316.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Royal Gramma Purple color name →
#A152BD
oklch(0.578 0.174 316.4)
カラー変換
- HEX
- #a152bd
- RGB
- rgb(161 82 189)
- HSL
- hsl(284 45% 53%)
- HWB
- hwb(284 32% 26%)
- OKLCH
- oklch(0.578 0.174 316.4)
- OKLab
- oklab(0.578 0.126 -0.12)
- CIE Lab
- lab(48.34 45.99 -43.05)
- LCH
- lch(48.34 62.99 316.9)
- CMYK
- cmyk(15% 57% 0% 26%)
ティント · シェード · トーン
ティント
- AB64C4
- B476CB
- BE87D2
- C798D9
- D1A9E0
- DABAE6
- E3CBED
- EDDDF3
- F6EEF9
シェード
- 8B46A4
- 763B8C
- 622F74
- 4E255D
- 3C1A47
- 2A1133
- 19081F
- 09020D
- 010002
トーン
- 9E58B7
- 9B5EB1
- 9863AC
- 9568A6
- 926DA0
- 8E719A
- 8B7593
- 87798D
- 847C87
カラーハーモニー
補色 +180°
- A152BD
Royal Gramma Purple
- 428F00
≈ Christmas Green
類似色 -30° +30°
- A152BD
Royal Gramma Purple
- 7564DA
≈ Exodus Fruit
- BE458E
≈ Boat Orchid
トライアド +120° +240°
- A152BD
Royal Gramma Purple
- A26E00
≈ Golden Hind
- 008B8D
≈ Egyptian Teal
スプリットコンプリメンタリー +150° +210°
- A152BD
Royal Gramma Purple
- 837E00
≈ Olive
- 00906A
≈ Sea Swell
テトラード +90° +180° +270°
- A152BD
Royal Gramma Purple
- C35300
≈ Rust Orange
- 428F00
≈ Christmas Green
- 0086AC
≈ Lyrebird
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 4.71:1 · APCA Lc 72
Ag
Fail黒の上
WCAG 4.45:1 · APCA Lc 29
最適な文字色: #FFFFFF
WCAG 4.71:1 (AA) · APCA Lc 72
Contrast pairs
コードスニペット
CSS
:root {
--royal-gramma-purple: #a152bd;
--royal-gramma-purple-rgb: 161 82 189;
--royal-gramma-purple-oklch: oklch(0.578 0.174 316.4);
}
.element {
color: var(--royal-gramma-purple);
background-color: hsl(284 45% 53%);
border-color: oklch(0.578 0.174 316.4);
}Tailwind CSS v4
@theme {
--color-royal-gramma-purple: #a152bd;
--color-royal-gramma-purple-50: #ffe6ff;
--color-royal-gramma-purple-100: #ffd6ff;
--color-royal-gramma-purple-200: #f4bdff;
--color-royal-gramma-purple-300: #dd9af0;
--color-royal-gramma-purple-400: #c67ae2;
--color-royal-gramma-purple-500: #b259d1;
--color-royal-gramma-purple-600: #964cb1;
--color-royal-gramma-purple-700: #793d8e;
--color-royal-gramma-purple-800: #582c6b;
--color-royal-gramma-purple-900: #3d1e4b;
--color-royal-gramma-purple-950: #270d32;
}SCSS
$royal-gramma-purple: #a152bd;
$royal-gramma-purple-rgb: 161, 82, 189;
$royal-gramma-purple-light: mix(#fff, $royal-gramma-purple, 20%);
$royal-gramma-purple-dark: mix(#000, $royal-gramma-purple, 20%);
.element {
color: $royal-gramma-purple;
box-shadow: 0 0 0 2px rgba($royal-gramma-purple, 0.35);
}