色名 · #A020FF
Veronica
Veronicaは#A020FF：rgb(160 32 255)、hsl(274 100% 56%)、oklch(0.578 0.286 303.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Veronica color name →
#A020FF
oklch(0.578 0.286 303.4)
カラー変換
- HEX
- #a020ff
- RGB
- rgb(160 32 255)
- HSL
- hsl(274 100% 56%)
- HWB
- hwb(274 13% 0%)
- OKLCH
- oklch(0.578 0.286 303.4)
- OKLab
- oklab(0.578 0.158 -0.239)
- CIE Lab
- lab(45.52 74.34 -85.08)
- LCH
- lch(45.52 112.98 311.1)
- CMYK
- cmyk(37% 87% 0% 0%)
ティント · シェード · トーン
ティント
- A948FF
- B263FF
- BB7AFF
- C48EFF
- CDA2FF
- D7B5FF
- E1C8FF
- EBDBFF
- F5EDFF
シェード
- 8B1ADE
- 7615BE
- 610F9E
- 4E0A80
- 3B0663
- 290348
- 19012E
- 090016
- 010003
トーン
- 9C38F3
- 9947E7
- 9653DA
- 925CCE
- 8F64C2
- 8C6BB5
- 8971A8
- 86779B
- 837C8E
カラーハーモニー
補色 +180°
- A020FF
Veronica
- 6A8600
≈ Swamp Green
類似色 -30° +30°
- A020FF
Veronica
- 5560FF
≈ Blue Heath Butterfly
- CA00B8
≈ Explosive Purple
トライアド +120° +240°
- A020FF
Veronica
- AF6500
≈ Ginger
- 008D80
≈ Porcelain Green
スプリットコンプリメンタリー +150° +210°
- A020FF
Veronica
- 927700
≈ Bhūrā Brown
- 00924E
≈ Moss
テトラード +90° +180° +270°
- A020FF
Veronica
- DA2F00
≈ Dazzling Red
- 6A8600
≈ Swamp Green
- 00899E
≈ Teal Blue
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 5.06:1 · APCA Lc 73
Ag
Fail黒の上
WCAG 4.14:1 · APCA Lc 29
最適な文字色: #FFFFFF
WCAG 5.06:1 (AA) · APCA Lc 73
Contrast pairs
コードスニペット
CSS
:root {
--veronica: #a020ff;
--veronica-rgb: 160 32 255;
--veronica-oklch: oklch(0.578 0.286 303.4);
}
.element {
color: var(--veronica);
background-color: hsl(274 100% 56%);
border-color: oklch(0.578 0.286 303.4);
}Tailwind CSS v4
@theme {
--color-veronica: #a020ff;
--color-veronica-50: #ffe0ff;
--color-veronica-100: #ffcfff;
--color-veronica-200: #f2b1ff;
--color-veronica-300: #db88ff;
--color-veronica-400: #c45fff;
--color-veronica-500: #b119ff;
--color-veronica-600: #951eef;
--color-veronica-700: #7819c0;
--color-veronica-800: #561192;
--color-veronica-900: #3c0c68;
--color-veronica-950: #260048;
}SCSS
$veronica: #a020ff;
$veronica-rgb: 160, 32, 255;
$veronica-light: mix(#fff, $veronica, 20%);
$veronica-dark: mix(#000, $veronica, 20%);
.element {
color: $veronica;
box-shadow: 0 0 0 2px rgba($veronica, 0.35);
}