最も近い色名 · #145BD6
#145BD6
最も近い色名: Frosted Blueberries
#145BD6（rgb(20 91 214)、hsl(218 83% 46%)、oklch(0.509 0.201 261)）に最も近い色名はFrosted Blueberriesです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#145BD6
oklch(0.509 0.201 261)
カラー変換
- HEX
- #145bd6
- RGB
- rgb(20 91 214)
- HSL
- hsl(218 83% 46%)
- HWB
- hwb(218 8% 16%)
- OKLCH
- oklch(0.509 0.201 261)
- OKLab
- oklab(0.509 -0.031 -0.198)
- CIE Lab
- lab(40.79 17.74 -70.25)
- LCH
- lch(40.79 72.46 284.2)
- CMYK
- cmyk(91% 57% 0% 16%)
ティント · シェード · トーン
ティント
- 306DDC
- 487FE1
- 5E90E6
- 75A0EB
- 8BB0EF
- A2C0F3
- B9D0F7
- D0E0FA
- E7EFFD
シェード
- 104EBA
- 0C419E
- 083584
- 05296A
- 031E52
- 01133B
- 010925
- 000310
- 000002
トーン
- 2461CE
- 3166C6
- 3C6BBE
- 466FB6
- 5172AE
- 5A76A5
- 64799C
- 6E7B93
- 777E8A
カラーハーモニー
補色 +180°
- 145BD6
Frosted Blueberries
- 845E00
≈ Soil of Avagddu
類似色 -30° +30°
- 145BD6
Frosted Blueberries
- 006F96
≈ Tropic Sea
- 6C43CD
≈ Purple Rain
トライアド +120° +240°
- 145BD6
Frosted Blueberries
- BE0A2E
≈ Old Glory Red
- 197B00
≈ Botanical Beauty
スプリットコンプリメンタリー +150° +210°
- 145BD6
Frosted Blueberries
- 9F4A00
≈ Oregon
- 696B00
≈ Brownish Green
テトラード +90° +180° +270°
- 145BD6
Frosted Blueberries
- B21574
≈ King’s Plum Pie
- 845E00
≈ Soil of Avagddu
- 00785E
≈ Emerald Dream
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.00:1 · APCA Lc 79
Ag
Fail黒の上
WCAG 3.49:1 · APCA Lc 23
最適な文字色: #FFFFFF
WCAG 6.00:1 (AA) · APCA Lc 79
Contrast pairs
コードスニペット
CSS
:root {
--frosted-blueberries: #145bd6;
--frosted-blueberries-rgb: 20 91 214;
--frosted-blueberries-oklch: oklch(0.509 0.201 261);
}
.element {
color: var(--frosted-blueberries);
background-color: hsl(218 83% 46%);
border-color: oklch(0.509 0.201 261);
}Tailwind CSS v4
@theme {
--color-frosted-blueberries: #145bd6;
--color-frosted-blueberries-50: #d7f6ff;
--color-frosted-blueberries-100: #c5e8ff;
--color-frosted-blueberries-200: #a7d4ff;
--color-frosted-blueberries-300: #80b4ff;
--color-frosted-blueberries-400: #569aff;
--color-frosted-blueberries-500: #2e7cff;
--color-frosted-blueberries-600: #286adf;
--color-frosted-blueberries-700: #2054b3;
--color-frosted-blueberries-800: #0e3e86;
--color-frosted-blueberries-900: #082b5f;
--color-frosted-blueberries-950: #001741;
}SCSS
$frosted-blueberries: #145bd6;
$frosted-blueberries-rgb: 20, 91, 214;
$frosted-blueberries-light: mix(#fff, $frosted-blueberries, 20%);
$frosted-blueberries-dark: mix(#000, $frosted-blueberries, 20%);
.element {
color: $frosted-blueberries;
box-shadow: 0 0 0 2px rgba($frosted-blueberries, 0.35);
}