CSS Color: DodgerBlue

Named CSS color DodgerBlue #1E90FF in HEX, rgb(30, 144, 255) in RGB, hsl(210, 100%, 56%) in HSL.

DodgerBlueBlue

Color Values

FormatValueCSS Usage
NamedDodgerBluecolor: DodgerBlue;
HEX#1E90FFcolor: #1E90FF;
RGBrgb(30, 144, 255)color: rgb(30, 144, 255);
HSLhsl(210, 100%, 56%)color: hsl(210, 100%, 56%);

About DodgerBlue

DodgerBlue is a bright, vivid blue named after the Los Angeles Dodgers baseball team. At hex `#1E90FF`, it sits at 210 degrees on the hue wheel with full saturation and 56% lightness. The moderate red component (30) gives it slightly more warmth than pure blue.

In web design, DodgerBlue is an excellent primary action color. Its brightness and clarity make it ideal for buttons, links, and interactive elements. It is similar to the blues used by many major tech companies and design systems like Material Design.

For accessibility, DodgerBlue against white achieves approximately 3.4:1 contrast, passing WCAG AA for large text only. For normal text, consider using it on dark backgrounds where it achieves excellent contrast. Many design systems darken DodgerBlue slightly for text use.

DodgerBlue is brighter and more saturated than SteelBlue, and lighter than RoyalBlue. It pairs well with white, light gray, dark navy, and orange accents. In Tailwind CSS, `blue-500` is a very close match, making DodgerBlue one of the most practical CSS named blues.

FAQ

What is the hex code for DodgerBlue?

The CSS named color DodgerBlue has the hex code #1E90FF. You can use it in CSS as color: #1E90FF; or simply color: DodgerBlue;.

What is DodgerBlue in RGB?

In RGB notation, DodgerBlue is rgb(30, 144, 255). Use it in CSS as color: rgb(30, 144, 255);.

What is DodgerBlue in HSL?

In HSL notation, DodgerBlue is hsl(210, 100%, 56%). Use it in CSS as color: hsl(210, 100%, 56%);.

What color category is DodgerBlue?

DodgerBlue belongs to the Blue color family in the CSS named colors specification.

Can I use the name "DodgerBlue" directly in CSS?

Yes. All modern browsers support CSS named colors. You can write color: DodgerBlue; or background-color: DodgerBlue; directly in your stylesheet. Named colors are case-insensitive.

Try in Color Converter

Convert DodgerBlue to other formats, check contrast ratios, explore palettes, and find the closest Tailwind CSS class.

Open Color Converter →