Colorise ProOKLCH Engine
ExploreStudioNamesPickerPairs
ExploreStudioNamesPickerPairsContrastExtract
Menu

Product

  • Home
  • Explore
  • Studio
  • Color Names

Tools

  • Picker
  • Color Pairs
  • Contrast
  • Image Extract
  • Gradient Lab
  • Palette Diff
  • Brand from URL

Guides

  • All guides
  • OKLCH vs HSL
  • WCAG vs APCA
  • OKLCH color scales
  • Gamut & sRGB
  • Extract from images
  • HEX to OKLCH
  • Dark mode colors
  • Color meanings
ホーム/カラー/#676CD3

最も近い色名 · #676CD3

#676CD3

最も近い色名: Arcane Brew

#676CD3(rgb(103 108 211)、hsl(237 55% 62%)、oklch(0.578 0.155 278.3))に最も近い色名はArcane Brewです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Blue mean? →

#676CD3

oklch(0.578 0.155 278.3)

カラー変換

HEX
#676cd3
RGB
rgb(103 108 211)
HSL
hsl(237 55% 62%)
HWB
hwb(237 40% 17%)
OKLCH
oklch(0.578 0.155 278.3)
OKLab
oklab(0.578 0.022 -0.154)
CIE Lab
lab(49.15 20.05 -54.82)
LCH
lch(49.15 58.37 290.1)
CMYK
cmyk(51% 49% 0% 17%)

ティント · シェード · トーン

ティント

  • 747BD9
  • 828ADE
  • 9099E3
  • 9FA7E8
  • AEB6EC
  • BEC4F0
  • CED3F5
  • DEE2F8
  • EEF0FC

シェード

  • 595DB7
  • 4B4E9C
  • 3D4082
  • 303269
  • 232551
  • 17193A
  • 0C0D24
  • 040410
  • 000002

トーン

  • 696FCB
  • 6B72C3
  • 6D74BB
  • 7076B3
  • 7278AB
  • 757AA3
  • 777C9A
  • 7A7D92
  • 7D7F89

カラーハーモニー

補色 +180°

  • 676CD3

    Arcane Brew

  • 8D7A00

    ≈ Moscow Papyrus

類似色 -30° +30°

  • 676CD3

    Arcane Brew

  • 057ED0

    ≈ Electron Blue

  • 945CBF

    ≈ Trunks Hair

トライアド +120° +240°

  • 676CD3

    Arcane Brew

  • C3512B

    ≈ Raucous Orange

  • 00915A

    ≈ Emerald Isle

スプリットコンプリメンタリー +150° +210°

  • 676CD3

    Arcane Brew

  • AA6900

    ≈ Butter Fudge

  • 5F8900

    ≈ Sap Green

テトラード +90° +180° +270°

  • 676CD3

    Arcane Brew

  • C24A68

    ≈ Vibrant Red

  • 8D7A00

    ≈ Moscow Papyrus

  • 008C85

    ≈ Greenish Blue

コントラストとアクセシビリティ

Ag

白の上

WCAG 4.50:1 · APCA Lc 71

AA
Ag

黒の上

WCAG 4.66:1 · APCA Lc 31

AA

最適な文字色: #000000

WCAG 4.66:1 (AA) · APCA Lc 31

Contrast pairs

  • #676CD3 / #FFFFFF
  • #676CD3 / #000000
  • #FFFFFF / #676CD3
  • #000000 / #676CD3

コードスニペット

CSS

:root {
  --arcane-brew: #676cd3;
  --arcane-brew-rgb: 103 108 211;
  --arcane-brew-oklch: oklch(0.578 0.155 278.3);
}

.element {
  color: var(--arcane-brew);
  background-color: hsl(237 55% 62%);
  border-color: oklch(0.578 0.155 278.3);
}

Tailwind CSS v4

@theme {
  --color-arcane-brew: #676cd3;
  --color-arcane-brew-50: #ecf1ff;
  --color-arcane-brew-100: #dde3ff;
  --color-arcane-brew-200: #c7cdff;
  --color-arcane-brew-300: #a8aeff;
  --color-arcane-brew-400: #8a93f8;
  --color-arcane-brew-500: #7176ea;
  --color-arcane-brew-600: #6065c5;
  --color-arcane-brew-700: #4c509f;
  --color-arcane-brew-800: #353b77;
  --color-arcane-brew-900: #242954;
  --color-arcane-brew-950: #131638;
}

SCSS

$arcane-brew: #676cd3;
$arcane-brew-rgb: 103, 108, 211;
$arcane-brew-light: mix(#fff, $arcane-brew, 20%);
$arcane-brew-dark: mix(#000, $arcane-brew, 20%);

.element {
  color: $arcane-brew;
  box-shadow: 0 0 0 2px rgba($arcane-brew, 0.35);
}

近い色名

  • 6F6ED1

    C64 Purple

  • 6264DC

    Exodus Fruit

  • 5170D7

    Cornflower

  • 5D76CB

    Indigo Light

  • 5566CC

    Borage Blue

  • 665FD1

    Dark Periwinkle

  • 5566DD

    Thick Blue

  • 746CC0

    Purple Toolbox

  • 7366BD

    Ultra Violet

  • 6666BB

    Bluish Purple Anemone

  • 7A6DC0

    Venus Violet

  • 7777CC

    Kickstart Purple

Palettes with similar colors

  • Steady Ultrapurple Merge NoirPink · 10 Colors
  • Pure Venus Violet CircuitPink · 10 Colors
  • Flood GardenPink · 10 Colors
  • Steady Arcane Brew CircuitPink · 5 Colors
  • Classic Flood BriefPink · 5 Colors
  • True Venus Violet StudioPink · Rainbow

ツールで開く

ピッカーペアコントラストチェッカーStudioJSON API
Colorise Pro

Free OKLCH color workspace: precision color picker, color pairs, WCAG & APCA contrast checker, palette from image, Studio systems, names, gradients, and brand tools. Export HEX, CSS, Tailwind & DTCG.

OKLCH Engine

Product

  • Home
  • Explore
  • Studio
  • Color Names
  • Color Codes

Tools

  • Color Picker
  • Color Pairs
  • Contrast Checker
  • Image Extract
  • Gradient Lab
  • Palette Diff
  • Brand from URL
  • For presentations
  • For business cards
  • For SaaS landings
  • Duo pairs
  • Trio systems

Guides

  • All guides
  • OKLCH vs HSL
  • WCAG vs APCA
  • OKLCH color scales
  • Gamut & sRGB
  • Extract from images
  • HEX to OKLCH
  • Dark mode colors
  • Color meanings

Legal

  • Privacy
  • Terms

© 2026 Colorise Pro. All rights reserved.

© 2026 Colorise Pro. Built for precision color work.

Report infringement: [email protected] (Colorise Pro)

PrivacyTermsOKLCH · WCAG · APCA