色名 · #5A79BA
Blue Android Base
Blue Android Baseは#5A79BA：rgb(90 121 186)、hsl(221 41% 54%)、oklch(0.581 0.107 264)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Blue mean? → · Blue Android Base color name →
#5A79BA
oklch(0.581 0.107 264)
カラー変換
- HEX
- #5a79ba
- RGB
- rgb(90 121 186)
- HSL
- hsl(221 41% 54%)
- HWB
- hwb(221 35% 27%)
- OKLCH
- oklch(0.581 0.107 264)
- OKLab
- oklab(0.581 -0.011 -0.106)
- CIE Lab
- lab(50.64 2.94 -38.28)
- LCH
- lch(50.64 38.39 274.4)
- CMYK
- cmyk(52% 35% 0% 27%)
ティント · シェード · トーン
ティント
- 6986C1
- 7993C9
- 89A1D0
- 99AED7
- A9BBDE
- BAC9E5
- CBD6EB
- DCE4F2
- EDF1F9
シェード
- 4D68A1
- 415889
- 354872
- 29395C
- 1E2B46
- 131D32
- 09101E
- 03050D
- 000102
トーン
- 5E7AB4
- 627BAF
- 667CA9
- 6A7DA4
- 6D7E9E
- 717E98
- 757F92
- 797F8C
- 7C8086
カラーハーモニー
補色 +180°
- 5A79BA
Blue Android Base
- 987421
≈ Glazed Chestnut
類似色 -30° +30°
- 5A79BA
Blue Android Base
- 2884B0
≈ Blue Splash
- 7E6DB4
≈ Clear Mauve
トライアド +120° +240°
- 5A79BA
Blue Android Base
- B15F5B
≈ Pottery Red
- 518B50
≈ Belfast
スプリットコンプリメンタリー +150° +210°
- 5A79BA
Blue Android Base
- AB6838
≈ Autumn Surprise
- 7A812E
≈ Pacifika
テトラード +90° +180° +270°
- 5A79BA
Blue Android Base
- AB5E7F
≈ Indian Pink
- 987421
≈ Glazed Chestnut
- 138F76
≈ Dòu Lǜ Green
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 4.30:1 · APCA Lc 70
Ag
AA黒の上
WCAG 4.87:1 · APCA Lc 32
最適な文字色: #000000
WCAG 4.87:1 (AA) · APCA Lc 32
Contrast pairs
コードスニペット
CSS
:root {
--blue-android-base: #5a79ba;
--blue-android-base-rgb: 90 121 186;
--blue-android-base-oklch: oklch(0.581 0.107 264);
}
.element {
color: var(--blue-android-base);
background-color: hsl(221 41% 54%);
border-color: oklch(0.581 0.107 264);
}Tailwind CSS v4
@theme {
--color-blue-android-base: #5a79ba;
--color-blue-android-base-50: #e7f5ff;
--color-blue-android-base-100: #d7e8ff;
--color-blue-android-base-200: #bfd4ff;
--color-blue-android-base-300: #9eb7ef;
--color-blue-android-base-400: #7e9ede;
--color-blue-android-base-500: #6284cd;
--color-blue-android-base-600: #5370ad;
--color-blue-android-base-700: #425a8b;
--color-blue-android-base-800: #2e4267;
--color-blue-android-base-900: #1f2d49;
--color-blue-android-base-950: #0f1a30;
}SCSS
$blue-android-base: #5a79ba;
$blue-android-base-rgb: 90, 121, 186;
$blue-android-base-light: mix(#fff, $blue-android-base, 20%);
$blue-android-base-dark: mix(#000, $blue-android-base, 20%);
.element {
color: $blue-android-base;
box-shadow: 0 0 0 2px rgba($blue-android-base, 0.35);
}