色名 · #A4D2E0
French Pass
French Passは#A4D2E0：rgb(164 210 224)、hsl(194 49% 76%)、oklch(0.836 0.052 218.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · French Pass color name →
#A4D2E0
oklch(0.836 0.052 218.4)
カラー変換
- HEX
- #a4d2e0
- RGB
- rgb(164 210 224)
- HSL
- hsl(194 49% 76%)
- HWB
- hwb(194 64% 12%)
- OKLCH
- oklch(0.836 0.052 218.4)
- OKLab
- oklab(0.836 -0.041 -0.032)
- CIE Lab
- lab(81.28 -13.19 -12.13)
- LCH
- lch(81.28 17.92 222.6)
- CMYK
- cmyk(27% 6% 0% 12%)
ティント · シェード · トーン
ティント
- ADD7E3
- B6DBE6
- C0E0E9
- C9E4EC
- D2E9F0
- DBEDF3
- E4F2F6
- EDF6F9
- F6FBFC
シェード
- 8EB6C3
- 799BA6
- 64818A
- 506870
- 3D5056
- 2B393E
- 1A2427
- 0A1012
- 010202
トーン
- A1CAD6
- 9DC1CC
- 9AB9C2
- 96B0B9
- 93A8AF
- 8FA0A5
- 8B989C
- 889092
- 848889
カラーハーモニー
補色 +180°
- A4D2E0
French Pass
- E8BEB1
≈ Virgin Peach
類似色 -30° +30°
- A4D2E0
French Pass
- A3D5D0
≈ Sinbad
- B0CDEA
≈ Featherbed
トライアド +120° +240°
- A4D2E0
French Pass
- E1BDD5
≈ Pink Peony
- D2CAA4
≈ Frozen Dew
スプリットコンプリメンタリー +150° +210°
- A4D2E0
French Pass
- E8BCC2
≈ Blush Kiss
- E0C4A6
≈ Apricot Illusion
テトラード +90° +180° +270°
- A4D2E0
French Pass
- D3C1E4
≈ York Plum
- E8BEB1
≈ Virgin Peach
- BFD0AD
≈ Gamin
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.63:1 · APCA Lc 28
Ag
AAA黒の上
WCAG 12.87:1 · APCA Lc 75
最適な文字色: #000000
WCAG 12.87:1 (AAA) · APCA Lc 75
Contrast pairs
コードスニペット
CSS
:root {
--french-pass: #a4d2e0;
--french-pass-rgb: 164 210 224;
--french-pass-oklch: oklch(0.836 0.052 218.4);
}
.element {
color: var(--french-pass);
background-color: hsl(194 49% 76%);
border-color: oklch(0.836 0.052 218.4);
}Tailwind CSS v4
@theme {
--color-french-pass: #a4d2e0;
--color-french-pass-50: #e6f9ff;
--color-french-pass-100: #d6ecf4;
--color-french-pass-200: #bddae4;
--color-french-pass-300: #9bbeca;
--color-french-pass-400: #7ca6b3;
--color-french-pass-500: #5e8f9d;
--color-french-pass-600: #507985;
--color-french-pass-700: #40616b;
--color-french-pass-800: #2d474e;
--color-french-pass-900: #1e3136;
--color-french-pass-950: #0e1d21;
}SCSS
$french-pass: #a4d2e0;
$french-pass-rgb: 164, 210, 224;
$french-pass-light: mix(#fff, $french-pass, 20%);
$french-pass-dark: mix(#000, $french-pass, 20%);
.element {
color: $french-pass;
box-shadow: 0 0 0 2px rgba($french-pass, 0.35);
}