色名 · #5E0DC2
Purplue
Purplueは#5E0DC2：rgb(94 13 194)、hsl(267 87% 41%)、oklch(0.434 0.234 292.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Purplue color name →
#5E0DC2
oklch(0.434 0.234 292.7)
カラー変換
- HEX
- #5e0dc2
- RGB
- rgb(94 13 194)
- HSL
- hsl(267 87% 41%)
- HWB
- hwb(267 5% 24%)
- OKLCH
- oklch(0.434 0.234 292.7)
- OKLab
- oklab(0.434 0.091 -0.216)
- CIE Lab
- lab(29.54 58.48 -76.91)
- LCH
- lch(29.54 96.61 307.2)
- CMYK
- cmyk(52% 93% 0% 24%)
ティント · シェード · トーン
ティント
- 6A38CA
- 7853D2
- 876AD9
- 9680E0
- A695E7
- B7ABEC
- C8C0F2
- DAD5F7
- ECEAFB
シェード
- 510AA8
- 44078F
- 370577
- 2B0360
- 1F0249
- 140134
- 0A0020
- 03000E
- 000002
トーン
- 6029BD
- 6239B7
- 6545B1
- 6850AB
- 6B59A5
- 6F629E
- 736A97
- 777290
- 7B7988
カラーハーモニー
補色 +180°
- 5E0DC2
Purplue
- 525600
≈ Douro
類似色 -30° +30°
- 5E0DC2
Purplue
- 003EC3
≈ Once in a Blue Moon
- 810090
≈ Aunt Violet
トライアド +120° +240°
- 5E0DC2
Purplue
- 7E3C00
≈ Hazelnut Chocolate
- 00604C
≈ Sci-Fi Takeout
スプリットコンプリメンタリー +150° +210°
- 5E0DC2
Purplue
- 694B00
≈ Antique Bronze
- 006303
≈ Emerald Green
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 9.08:1 · APCA Lc 89
Ag
Fail黒の上
WCAG 2.31:1 · APCA Lc 13
最適な文字色: #FFFFFF
WCAG 9.08:1 (AAA) · APCA Lc 89
Contrast pairs
コードスニペット
CSS
:root {
--purplue: #5e0dc2;
--purplue-rgb: 94 13 194;
--purplue-oklch: oklch(0.434 0.234 292.7);
}
.element {
color: var(--purplue);
background-color: hsl(267 87% 41%);
border-color: oklch(0.434 0.234 292.7);
}Tailwind CSS v4
@theme {
--color-purplue: #5e0dc2;
--color-purplue-50: #f9e9ff;
--color-purplue-100: #edd9ff;
--color-purplue-200: #dbbfff;
--color-purplue-300: #c19bff;
--color-purplue-400: #a77aff;
--color-purplue-500: #9353ff;
--color-purplue-600: #7c48e4;
--color-purplue-700: #633ab8;
--color-purplue-800: #462a8b;
--color-purplue-900: #301c63;
--color-purplue-950: #1d0a44;
}SCSS
$purplue: #5e0dc2;
$purplue-rgb: 94, 13, 194;
$purplue-light: mix(#fff, $purplue, 20%);
$purplue-dark: mix(#000, $purplue, 20%);
.element {
color: $purplue;
box-shadow: 0 0 0 2px rgba($purplue, 0.35);
}