色名 · #ADA2CE
Puturple
Puturpleは#ADA2CE：rgb(173 162 206)、hsl(255 31% 72%)、oklch(0.737 0.064 296.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Puturple color name →
#ADA2CE
oklch(0.737 0.064 296.3)
カラー変換
- HEX
- #ada2ce
- RGB
- rgb(173 162 206)
- HSL
- hsl(255 31% 72%)
- HWB
- hwb(255 64% 19%)
- OKLCH
- oklch(0.737 0.064 296.3)
- OKLab
- oklab(0.737 0.028 -0.057)
- CIE Lab
- lab(68.71 10.76 -21.1)
- LCH
- lch(68.71 23.68 297)
- CMYK
- cmyk(16% 21% 0% 19%)
ティント · シェード · トーン
ティント
- B5ABD3
- BDB4D8
- C5BDDD
- CDC7E2
- D5D0E7
- DDD9EC
- E6E3F1
- EEECF5
- F6F5FA
シェード
- 968CB3
- 7F7798
- 6A637F
- 554F66
- 413C4E
- 2D2A38
- 1B1923
- 0B0A0F
- 010102
トーン
- A89FC6
- A49BBE
- 9F98B6
- 9B94AE
- 9691A7
- 928E9F
- 8D8A97
- 89878F
- 848388
カラーハーモニー
補色 +180°
- ADA2CE
Puturple
- A7AF81
≈ Fresh Guacamole
類似色 -30° +30°
- ADA2CE
Puturple
- 97A9D3
≈ Foresight
- C09CBF
≈ Lupine
トライアド +120° +240°
- ADA2CE
Puturple
- CAA083
≈ Arbol de Tamarindo
- 7EB7A8
≈ Mint Bonbon Green
スプリットコンプリメンタリー +150° +210°
- ADA2CE
Puturple
- BCA87C
≈ Malt Shake
- 90B592
≈ Mountain Fern
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.37:1 · APCA Lc 47
Ag
AAA黒の上
WCAG 8.83:1 · APCA Lc 55
最適な文字色: #000000
WCAG 8.83:1 (AAA) · APCA Lc 55
Contrast pairs
コードスニペット
CSS
:root {
--puturple: #ada2ce;
--puturple-rgb: 173 162 206;
--puturple-oklch: oklch(0.737 0.064 296.3);
}
.element {
color: var(--puturple);
background-color: hsl(255 31% 72%);
border-color: oklch(0.737 0.064 296.3);
}Tailwind CSS v4
@theme {
--color-puturple: #ada2ce;
--color-puturple-50: #f7f2ff;
--color-puturple-100: #eae4fb;
--color-puturple-200: #d7cfed;
--color-puturple-300: #bbb1d4;
--color-puturple-400: #a197c0;
--color-puturple-500: #8a7eac;
--color-puturple-600: #756a91;
--color-puturple-700: #5d5575;
--color-puturple-800: #433e57;
--color-puturple-900: #2f2b3c;
--color-puturple-950: #1b1826;
}SCSS
$puturple: #ada2ce;
$puturple-rgb: 173, 162, 206;
$puturple-light: mix(#fff, $puturple, 20%);
$puturple-dark: mix(#000, $puturple, 20%);
.element {
color: $puturple;
box-shadow: 0 0 0 2px rgba($puturple, 0.35);
}