最も近い色名 · #87A0C7
#87A0C7
最も近い色名: Wisteria Blue
#87A0C7(rgb(135 160 199)、hsl(217 36% 65%)、oklch(0.701 0.064 259.2))に最も近い色名はWisteria Blueです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#87A0C7
oklch(0.701 0.064 259.2)
カラー変換
- HEX
- #87a0c7
- RGB
- rgb(135 160 199)
- HSL
- hsl(217 36% 65%)
- HWB
- hwb(217 53% 22%)
- OKLCH
- oklch(0.701 0.064 259.2)
- OKLab
- oklab(0.701 -0.012 -0.063)
- CIE Lab
- lab(65.01 -2 -23.17)
- LCH
- lch(65.01 23.26 265.1)
- CMYK
- cmyk(32% 20% 0% 22%)
ティント · シェード · トーン
ティント
- 93A9CD
- 9EB3D2
- AABCD8
- B6C5DE
- C2CFE3
- CED8E9
- DAE2EF
- E6ECF4
- F3F5FA
シェード
- 758BAD
- 637693
- 51617A
- 414E62
- 313B4C
- 212936
- 131921
- 06090E
- 010102
トーン
- 869DC0
- 869AB9
- 8596B2
- 8493AA
- 8490A3
- 838D9C
- 828A95
- 82868E
- 818387
カラーハーモニー
補色 +180°
- 87A0C7
Wisteria Blue
- B49B71
≈ Lark
類似色 -30° +30°
- 87A0C7
Wisteria Blue
- 74A7BF
≈ Blue Ridge Mist
- 9D99C5
≈ Majestic Violet
トライアド +120° +240°
- 87A0C7
Wisteria Blue
- C48F8F
≈ Floral Tapestry
- 8BA983
≈ Baby Spinach
スプリットコンプリメンタリー +150° +210°
- 87A0C7
Wisteria Blue
- C0937C
≈ Florentine Clay
- A1A274
≈ Dill Powder
テトラード +90° +180° +270°
- 87A0C7
Wisteria Blue
- BE8FA5
≈ Elite Pink
- B49B71
≈ Lark
- 76AC98
≈ Acapulco
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.66:1 · APCA Lc 52
Ag
AAA黒の上
WCAG 7.88:1 · APCA Lc 50
最適な文字色: #000000
WCAG 7.88:1 (AAA) · APCA Lc 50
Contrast pairs
コードスニペット
CSS
:root {
--wisteria-blue: #87a0c7;
--wisteria-blue-rgb: 135 160 199;
--wisteria-blue-oklch: oklch(0.701 0.064 259.2);
}
.element {
color: var(--wisteria-blue);
background-color: hsl(217 36% 65%);
border-color: oklch(0.701 0.064 259.2);
}Tailwind CSS v4
@theme {
--color-wisteria-blue: #87a0c7;
--color-wisteria-blue-50: #ebf6ff;
--color-wisteria-blue-100: #dce9fe;
--color-wisteria-blue-200: #c5d5f0;
--color-wisteria-blue-300: #a5b8d9;
--color-wisteria-blue-400: #88a0c5;
--color-wisteria-blue-500: #6d87b1;
--color-wisteria-blue-600: #5c7395;
--color-wisteria-blue-700: #4a5c78;
--color-wisteria-blue-800: #344359;
--color-wisteria-blue-900: #242e3e;
--color-wisteria-blue-950: #121b27;
}SCSS
$wisteria-blue: #87a0c7;
$wisteria-blue-rgb: 135, 160, 199;
$wisteria-blue-light: mix(#fff, $wisteria-blue, 20%);
$wisteria-blue-dark: mix(#000, $wisteria-blue, 20%);
.element {
color: $wisteria-blue;
box-shadow: 0 0 0 2px rgba($wisteria-blue, 0.35);
}