色名 · #E86EAD
Amaranth
Amaranthは#E86EAD：rgb(232 110 173)、hsl(329 73% 67%)、oklch(0.701 0.166 350)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Amaranth color name →
#E86EAD
oklch(0.701 0.166 350)
カラー変換
- HEX
- #e86ead
- RGB
- rgb(232 110 173)
- HSL
- hsl(329 73% 67%)
- HWB
- hwb(329 43% 9%)
- OKLCH
- oklch(0.701 0.166 350)
- OKLab
- oklab(0.701 0.163 -0.029)
- CIE Lab
- lab(63.07 53.17 -10.25)
- LCH
- lch(63.07 54.15 349.1)
- CMYK
- cmyk(0% 53% 25% 9%)
ティント · シェード · トーン
ティント
- EC7EB5
- F08DBD
- F39BC5
- F6AACD
- F9B8D5
- FBC6DE
- FCD5E6
- FEE3EE
- FFF1F7
シェード
- CA5F96
- AC507F
- 90416A
- 743355
- 592641
- 40192D
- 290E1B
- 13040B
- 030101
トーン
- DE71A8
- D474A4
- CA769F
- C0789B
- B67A96
- AC7C92
- A17D8D
- 977E89
- 8B7F84
カラーハーモニー
補色 +180°
- E86EAD
Amaranth
- 00BA91
≈ Mountain Meadow
類似色 -30° +30°
- E86EAD
Amaranth
- CB79DE
≈ Jewel Caterpillar
- F46E73
≈ Sugar Coral
トライアド +120° +240°
- E86EAD
Amaranth
- A5A600
≈ Jīn Sè Gold
- 00ADE4
≈ Royal Peacock
スプリットコンプリメンタリー +150° +210°
- E86EAD
Amaranth
- 60B74D
≈ Pure Apple
- 00B4BC
≈ Marrakech Mile
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.89:1 · APCA Lc 55
Ag
AAA黒の上
WCAG 7.26:1 · APCA Lc 47
最適な文字色: #000000
WCAG 7.26:1 (AAA) · APCA Lc 47
Contrast pairs
コードスニペット
CSS
:root {
--amaranth: #e86ead;
--amaranth-rgb: 232 110 173;
--amaranth-oklch: oklch(0.701 0.166 350);
}
.element {
color: var(--amaranth);
background-color: hsl(329 73% 67%);
border-color: oklch(0.701 0.166 350);
}Tailwind CSS v4
@theme {
--color-amaranth: #e86ead;
--color-amaranth-50: #ffe2fa;
--color-amaranth-100: #ffd2ee;
--color-amaranth-200: #ffb7dc;
--color-amaranth-300: #f892c0;
--color-amaranth-400: #e571ac;
--color-amaranth-500: #d24d95;
--color-amaranth-600: #b1427e;
--color-amaranth-700: #8e3565;
--color-amaranth-800: #69254c;
--color-amaranth-900: #4a1935;
--color-amaranth-950: #300920;
}SCSS
$amaranth: #e86ead;
$amaranth-rgb: 232, 110, 173;
$amaranth-light: mix(#fff, $amaranth, 20%);
$amaranth-dark: mix(#000, $amaranth, 20%);
.element {
color: $amaranth;
box-shadow: 0 0 0 2px rgba($amaranth, 0.35);
}