最も近い色名 · #879FC9
#879FC9
最も近い色名: Wisteria Blue
#879FC9(rgb(135 159 201)、hsl(218 38% 66%)、oklch(0.699 0.068 261.5))に最も近い色名はWisteria Blueです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#879FC9
oklch(0.699 0.068 261.5)
カラー変換
- HEX
- #879fc9
- RGB
- rgb(135 159 201)
- HSL
- hsl(218 38% 66%)
- HWB
- hwb(218 53% 21%)
- OKLCH
- oklch(0.699 0.068 261.5)
- OKLab
- oklab(0.699 -0.01 -0.067)
- CIE Lab
- lab(64.79 -1.09 -24.6)
- LCH
- lch(64.79 24.63 267.5)
- CMYK
- cmyk(33% 21% 0% 21%)
ティント · シェード · トーン
ティント
- 92A8CF
- 9EB2D4
- AABBDA
- B6C5DF
- C2CEE4
- CED8EA
- DAE2EF
- E6EBF4
- F3F5FA
シェード
- 758AAE
- 637595
- 51617C
- 414D64
- 313B4C
- 212936
- 131822
- 06090F
- 010102
トーン
- 869CC2
- 8699BA
- 8596B3
- 8493AC
- 8490A4
- 838D9D
- 828996
- 82868E
- 818387
カラーハーモニー
補色 +180°
- 879FC9
Wisteria Blue
- B49A6E
≈ Dust
類似色 -30° +30°
- 879FC9
Wisteria Blue
- 72A6C1
≈ Serene Sea
- 9E97C6
≈ Majestic Violet
トライアド +120° +240°
- 879FC9
Wisteria Blue
- C58E8C
≈ Grand Sunset
- 87A982
≈ Baby Spinach
スプリットコンプリメンタリー +150° +210°
- 879FC9
Wisteria Blue
- C19378
≈ Florentine Clay
- 9FA372
≈ Cucuzza Verde
テトラード +90° +180° +270°
- 879FC9
Wisteria Blue
- C08DA3
≈ Winsome Rose
- B49A6E
≈ Dust
- 72AC99
≈ Acapulco
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.68:1 · APCA Lc 52
Ag
AAA黒の上
WCAG 7.83:1 · APCA Lc 50
最適な文字色: #000000
WCAG 7.83:1 (AAA) · APCA Lc 50
Contrast pairs
コードスニペット
CSS
:root {
--wisteria-blue: #879fc9;
--wisteria-blue-rgb: 135 159 201;
--wisteria-blue-oklch: oklch(0.699 0.068 261.5);
}
.element {
color: var(--wisteria-blue);
background-color: hsl(218 38% 66%);
border-color: oklch(0.699 0.068 261.5);
}Tailwind CSS v4
@theme {
--color-wisteria-blue: #879fc9;
--color-wisteria-blue-50: #ebf6ff;
--color-wisteria-blue-100: #dce8ff;
--color-wisteria-blue-200: #c5d5f2;
--color-wisteria-blue-300: #a6b8db;
--color-wisteria-blue-400: #889fc7;
--color-wisteria-blue-500: #6d87b4;
--color-wisteria-blue-600: #5d7298;
--color-wisteria-blue-700: #4a5b7a;
--color-wisteria-blue-800: #34435a;
--color-wisteria-blue-900: #242e3f;
--color-wisteria-blue-950: #131b28;
}SCSS
$wisteria-blue: #879fc9;
$wisteria-blue-rgb: 135, 159, 201;
$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);
}