色名 · #76C5E7
Spritzig
Spritzigは#76C5E7：rgb(118 197 231)、hsl(198 70% 68%)、oklch(0.785 0.092 227.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · Spritzig color name →
#76C5E7
oklch(0.785 0.092 227.6)
カラー変換
- HEX
- #76c5e7
- RGB
- rgb(118 197 231)
- HSL
- hsl(198 70% 68%)
- HWB
- hwb(198 46% 9%)
- OKLCH
- oklch(0.785 0.092 227.6)
- OKLab
- oklab(0.785 -0.062 -0.068)
- CIE Lab
- lab(75.39 -18.44 -24.97)
- LCH
- lch(75.39 31.05 233.6)
- CMYK
- cmyk(49% 15% 0% 9%)
ティント · シェード · トーン
ティント
- 85CBEA
- 94D1EC
- A2D7EF
- AFDDF1
- BDE2F4
- CAE8F6
- D8EEF8
- E5F4FB
- F2F9FD
シェード
- 66ABC9
- 5692AB
- 47798F
- 386173
- 294B59
- 1C3540
- 0F2128
- 050E13
- 010203
トーン
- 78BEDC
- 7BB7D2
- 7CB0C7
- 7EA9BD
- 7FA2B3
- 7F9BA8
- 80959E
- 808E94
- 80878A
カラーハーモニー
補色 +180°
- 76C5E7
Spritzig
- EAA786
≈ Ceramic Glaze
類似色 -30° +30°
- 76C5E7
Spritzig
- 6ACBCE
≈ Tropical Splash
- 94BBF4
≈ Electric Eel
トライアド +120° +240°
- 76C5E7
Spritzig
- E5A1C4
≈ Prettiest Pink
- BFBE77
≈ Pine Glade
スプリットコンプリメンタリー +150° +210°
- 76C5E7
Spritzig
- EEA1A3
≈ Pink Icing
- DAB274
≈ Egyptian Temple
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.92:1 · APCA Lc 37
Ag
AAA黒の上
WCAG 10.91:1 · APCA Lc 66
最適な文字色: #000000
WCAG 10.91:1 (AAA) · APCA Lc 66
Contrast pairs
コードスニペット
CSS
:root {
--spritzig: #76c5e7;
--spritzig-rgb: 118 197 231;
--spritzig-oklch: oklch(0.785 0.092 227.6);
}
.element {
color: var(--spritzig);
background-color: hsl(198 70% 68%);
border-color: oklch(0.785 0.092 227.6);
}Tailwind CSS v4
@theme {
--color-spritzig: #76c5e7;
--color-spritzig-50: #dbfbff;
--color-spritzig-100: #caeeff;
--color-spritzig-200: #acdcf4;
--color-spritzig-300: #86c1dd;
--color-spritzig-400: #5fa9c9;
--color-spritzig-500: #3592b5;
--color-spritzig-600: #2f7b99;
--color-spritzig-700: #25637b;
--color-spritzig-800: #18495a;
--color-spritzig-900: #0f323f;
--color-spritzig-950: #021e28;
}SCSS
$spritzig: #76c5e7;
$spritzig-rgb: 118, 197, 231;
$spritzig-light: mix(#fff, $spritzig, 20%);
$spritzig-dark: mix(#000, $spritzig, 20%);
.element {
color: $spritzig;
box-shadow: 0 0 0 2px rgba($spritzig, 0.35);
}