色名 · #7BBDC7
Aqua Vitale
Aqua Vitaleは#7BBDC7：rgb(123 189 199)、hsl(188 40% 63%)、oklch(0.758 0.068 207.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · Aqua Vitale color name →
#7BBDC7
oklch(0.758 0.068 207.9)
カラー変換
- HEX
- #7bbdc7
- RGB
- rgb(123 189 199)
- HSL
- hsl(188 40% 63%)
- HWB
- hwb(188 48% 22%)
- OKLCH
- oklch(0.758 0.068 207.9)
- OKLab
- oklab(0.758 -0.06 -0.032)
- CIE Lab
- lab(72.46 -19.92 -12.09)
- LCH
- lch(72.46 23.3 211.2)
- CMYK
- cmyk(38% 5% 0% 22%)
ティント · シェード · トーン
ティント
- 89C4CD
- 97CAD2
- A4D1D8
- B1D7DD
- BEDEE3
- CBE5E8
- D8EBEE
- E5F2F4
- F2F8F9
シェード
- 6AA4AD
- 5A8C93
- 4A747A
- 3A5D62
- 2C474C
- 1E3336
- 101F21
- 050D0E
- 010202
トーン
- 7CB7C0
- 7EB1B8
- 7FAAB1
- 7FA4AA
- 809EA3
- 80989C
- 819295
- 818C8E
- 808687
カラーハーモニー
補色 +180°
- 7BBDC7
Aqua Vitale
- D9A098
≈ Rhapsodic
類似色 -30° +30°
- 7BBDC7
Aqua Vitale
- 80BFB0
≈ Mintage
- 87B7D7
≈ Periwinkle Sky
トライアド +120° +240°
- 7BBDC7
Aqua Vitale
- C9A1C7
≈ Stormy Sunrise
- C3AE7E
≈ Butterbrot
スプリットコンプリメンタリー +150° +210°
- 7BBDC7
Aqua Vitale
- D59FB0
≈ Lili Elbe’s Pink
- D2A686
≈ Sunset Beige
テトラード +90° +180° +270°
- 7BBDC7
Aqua Vitale
- B5A8D7
≈ Grape Illusion
- D9A098
≈ Rhapsodic
- ACB785
≈ Grant Wood Ivy
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.11:1 · APCA Lc 41
Ag
AAA黒の上
WCAG 9.94:1 · APCA Lc 61
最適な文字色: #000000
WCAG 9.94:1 (AAA) · APCA Lc 61
Contrast pairs
コードスニペット
CSS
:root {
--aqua-vitale: #7bbdc7;
--aqua-vitale-rgb: 123 189 199;
--aqua-vitale-oklch: oklch(0.758 0.068 207.9);
}
.element {
color: var(--aqua-vitale);
background-color: hsl(188 40% 63%);
border-color: oklch(0.758 0.068 207.9);
}Tailwind CSS v4
@theme {
--color-aqua-vitale: #7bbdc7;
--color-aqua-vitale-50: #e0fbff;
--color-aqua-vitale-100: #cfeff5;
--color-aqua-vitale-200: #b3dde4;
--color-aqua-vitale-300: #8fc2cb;
--color-aqua-vitale-400: #6caab3;
--color-aqua-vitale-500: #49939e;
--color-aqua-vitale-600: #3f7c85;
--color-aqua-vitale-700: #32646b;
--color-aqua-vitale-800: #23494e;
--color-aqua-vitale-900: #173336;
--color-aqua-vitale-950: #081e21;
}SCSS
$aqua-vitale: #7bbdc7;
$aqua-vitale-rgb: 123, 189, 199;
$aqua-vitale-light: mix(#fff, $aqua-vitale, 20%);
$aqua-vitale-dark: mix(#000, $aqua-vitale, 20%);
.element {
color: $aqua-vitale;
box-shadow: 0 0 0 2px rgba($aqua-vitale, 0.35);
}