色名 · #7C70AA
Plum Preserve
Plum Preserveは#7C70AA：rgb(124 112 170)、hsl(252 25% 55%)、oklch(0.579 0.088 292.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Plum Preserve color name →
#7C70AA
oklch(0.579 0.088 292.9)
カラー変換
- HEX
- #7c70aa
- RGB
- rgb(124 112 170)
- HSL
- hsl(252 25% 55%)
- HWB
- hwb(252 44% 33%)
- OKLCH
- oklch(0.579 0.088 292.9)
- OKLab
- oklab(0.579 0.034 -0.081)
- CIE Lab
- lab(50.14 14.68 -29.59)
- LCH
- lch(50.14 33.03 296.4)
- CMYK
- cmyk(27% 34% 0% 33%)
ティント · シェード · トーン
ティント
- 887EB3
- 948BBB
- A199C4
- AEA8CD
- BBB6D5
- C8C4DD
- D6D3E6
- E3E1EE
- F1F0F7
シェード
- 6B6093
- 5A517D
- 4A4368
- 3B3553
- 2C273F
- 1E1A2D
- 110E1B
- 05040B
- 010101
トーン
- 7C72A6
- 7D74A2
- 7D759E
- 7D779A
- 7E7996
- 7E7A91
- 7F7C8D
- 7F7D89
- 7F7F84
カラーハーモニー
補色 +180°
- 7C70AA
Plum Preserve
- 7A803F
≈ Thai Basil
類似色 -30° +30°
- 7C70AA
Plum Preserve
- 5E7AAF
≈ Deck Crew
- 936899
≈ Tulipan Violet
トライアド +120° +240°
- 7C70AA
Plum Preserve
- A36B47
≈ Hazel
- 378B75
≈ Ionian
スプリットコンプリメンタリー +150° +210°
- 7C70AA
Plum Preserve
- 947537
≈ California Gold Rush
- 5A8857
≈ Emerald Ring
テトラード +90° +180° +270°
- 7C70AA
Plum Preserve
- A86461
≈ Rose Marquee
- 7A803F
≈ Thai Basil
- 258991
≈ Turkish Jade
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 4.41:1 · APCA Lc 71
Ag
AA黒の上
WCAG 4.75:1 · APCA Lc 31
最適な文字色: #000000
WCAG 4.75:1 (AA) · APCA Lc 31
Contrast pairs
コードスニペット
CSS
:root {
--plum-preserve: #7c70aa;
--plum-preserve-rgb: 124 112 170;
--plum-preserve-oklch: oklch(0.579 0.088 292.9);
}
.element {
color: var(--plum-preserve);
background-color: hsl(252 25% 55%);
border-color: oklch(0.579 0.088 292.9);
}Tailwind CSS v4
@theme {
--color-plum-preserve: #7c70aa;
--color-plum-preserve-50: #f6f1ff;
--color-plum-preserve-100: #e9e3ff;
--color-plum-preserve-200: #d6cdf7;
--color-plum-preserve-300: #baafe1;
--color-plum-preserve-400: #a095ce;
--color-plum-preserve-500: #887bbc;
--color-plum-preserve-600: #73689e;
--color-plum-preserve-700: #5c537f;
--color-plum-preserve-800: #423d5f;
--color-plum-preserve-900: #2e2a42;
--color-plum-preserve-950: #1b172b;
}SCSS
$plum-preserve: #7c70aa;
$plum-preserve-rgb: 124, 112, 170;
$plum-preserve-light: mix(#fff, $plum-preserve, 20%);
$plum-preserve-dark: mix(#000, $plum-preserve, 20%);
.element {
color: $plum-preserve;
box-shadow: 0 0 0 2px rgba($plum-preserve, 0.35);
}