Gradient Page

#2193B0

#2193B0 is the HEX color code for
Eastern Blue
#2193B0

Eastern Blue

Contrast
Dark
Luminance
46%
Color Conversions
Formats for Eastern Blue (#2193B0) in various color spaces.
#2193B0
33, 147, 176
192°, 68%, 41%
81%, 16%, 0%, 31%
0.616, 0.104, 219.9
--color-eastern-blue: #2193B0;

Shades & Tints

#eaf7fb
#bfe8f3
#94d9eb
#69cae2
#3ebbda
#25a2c1
#1d7e96
#145a6b
#0c3640
#041215
DarkestBaseLightest

Color Harmonies

Complementary

#2193B0
#b03e21

Analogous

#21b085
#2193B0
#214cb0

Triadic

#2193B0
#b02193
#93b021

Split Complementary

#2193B0
#b0214c
#b08521

UI Component Examples

See how #2193B0 looks when applied to real interface components.

Interactive Elements
Surface & Accent
Pro Tip!

Use lighter tints for backgrounds to maintain readability while keeping brand identity.

Status Indicator
Active
# CSS Variables
Copy-paste these variables into your global CSS to use this palette instantly.
:root {
  /* Eastern Blue Base */
  --color-primary: #2193B0;
  --color-primary-rgb: 33 147 176;
  --color-primary-hsl: 192 68% 41%;
  
  /* Foreground text color based on contrast */
  --color-primary-foreground: #ffffff;

  /* Shades */
  --color-primary-50:  #eaf7fb;
  --color-primary-100: #bfe8f3;
  --color-primary-200: #94d9eb;
  --color-primary-300: #69cae2;
  --color-primary-400: #3ebbda;
  --color-primary-500: #25a2c1;
  --color-primary-600: #1d7e96;
  --color-primary-700: #145a6b;
  --color-primary-800: #0c3640;
  --color-primary-900: #041215;
}

Want more?

We hope you enjoyed this color. Keep reading for more amazing colorful content for developers, designers and creators!
View our entire collection of UI gradientsView all our color names
#2193B0 Hex Color | Eastern Blue sl | UI Color Scheme Generator