Blue Colors
449 blue colors in the library, 145 of them carrying a registered name. Every swatch opens a full breakdown: hex, RGB, HSL, HSV, CMYK, LAB and OKLCH values, WCAG contrast, harmonies, tints and shades.
Blue runs from about 200° to 255° and is the most used hue in interface and brand design. It reads as stable and low-risk, it is the default for links, and it stays legible for most viewers with colour vision deficiency. Blue also darkens more gracefully than any other hue: a navy is simply a dark blue, with no shift into a different family.
Named Blue Colors
The blues that carry a published name, from the CSS keywords through the paint and print registries. These are the ones worth referring to by name in a brief, because the person reading it can look them up.
- Absolute Zero#0048BA
- Aero#7CB9E8
- Air Force Blue#5D8AA8
- Air Superiority Blue#72A0C1
- Alice Blue#F0F8FF
- Amethyst (Crayola)#64609A
- B'dazzled Blue#2E5894
- Baby Blue Eyes#A1CAF1
- Beau Blue#BCD4E6
- Black Coral#54626F
- Bleu de France#318CE7
- Blue#0000FF
- Blue (Crayola)#1F75FE
- Blue (Pantone)#0018A8
- Blue (Pigment)#333399
- Blue Bell#A2A2D0
- Blue Jeans#5DADEC
- Blue Ribbon#0B10A2
- Blue Yonder#5072A7
- Blue-gray#6699CC
- Blueberry#4F86F7
- Bluetiful#3C69E7
- Bright Navy Blue#1974D2
- Cadet Gray#91A3B0
- Carolina Blue#4B9CD3
- Cerulean Blue#2A52BE
- Cerulean Frost#6D9BC3
- Charcoal#36454F
- Chrome#DBE4EB
- Cloud#EFF1FE
- Cobalt Blue#0047AB
- Columbia Blue#9BDDFF
- Cool Gray#8C92AC
- Cornflower Blue#6495ED
- Cornflower Blue (Crayola)#93CCEA
- Cosmic Cobalt#2E2D88
- Dark Blue#00008B
- Dark Blue-gray#666699
- Dark Electric Blue#536878
- Dark Midnight Blue#003366
- Dark Slate Blue#483D8B
- Deep Navy#0B1F3A
- Denim#1560BD
- Denim Blue#2243B6
- Dodger Blue#1E90FF
- Duke Blue#00009C
- Egyptian Blue#1034A6
- French Blue#0072BB
- French Sky Blue#77B5FE
- Ghost White#F8F8FF
- Glaucous#6082B6
- Green-blue#1164B4
- Green-blue (Crayola)#2887C8
- Gunmetal#2A3439
- Han Blue#446CCF
- Honolulu Blue#006DB0
- Iceberg#71A6D2
- Imperial Blue#002395
- Independence#4C516D
- Indigo (Crayola)#4F69C6
- Indigo Dye#00416A
- Iridescent Indigo#3C32CD
- Iris#5A4FCF
- Iron Indigo#184FA1
- Lapis Lazuli#26619C
- Lavender#E6E6FA
- Lavender Gray#C4C3D0
- Light Cobalt Blue#88ACE0
- Light Periwinkle#C5CBE1
- Light Sky Blue#87CEFA
- Light Slate Gray#778899
- Light Steel Blue#B0C4DE
- Little Boy Blue#6CA0DC
- Maastricht Blue#001C3D
- Majorelle Blue#6050DC
- Manatee#979AAA
- Marine Blue#01386A
- Maximum Blue Purple#ACACE6
- Maya Blue#73C2FB
- Medium Blue#0000CD
- Medium Electric Blue#035096
- Medium Persian Blue#0067A5
- Medium Slate Blue#7B68EE
- Metallic Blue#32527B
- Microsoft Edge Blue#0078D7
- Midnight Blue#191970
- Navy#000080
- Neon Blue#1B03A3
- New Car#214FC6
- Ocean Boat Blue#0077BE
- Oxford Blue#002147
- Palatinate Blue#273BE2
- Pale Cerulean#9BC4E2
- Pale Cornflower Blue#ABCDEF
- Pale Cyan#87D3F8
- Perano (Infinitely Hot)#94B1FF
- Periwinkle#CCCCFF
- Periwinkle (Crayola)#C3CDE6
- Persian Blue#1C39BB
- Pewter Blue#8BA8B7
- Philippine Blue#0038A7
- Philippine Sky Blue#0066FF
- Phthalo Blue#000F89
- Picton Blue#45B1E8
- Plump Purple#5946B2
- Police Blue#374F6B
- Prussian Blue#003153
- Purple Navy#4E5180
- Queen Blue#436B95
- Resolution Blue#002387
- Rhythm#777696
- Rich Black#010B13
- Royal Azure#0038A8
- Royal Blue#4169E1
- Samsung Blue#12279E
- Sapphire#0F52BA
- Sapphire Navy#082567
- Savoy Blue#4B61D1
- Shadow Blue#778BA5
- Silver Lake Blue#5D89BA
- Slate Blue#6A5ACD
- Slate Gray#708090
- Smalt (Dark Powder Blue)#003399
- Soap#CEC8EF
- Space Cadet#1D2951
- Spanish Blue#0070B8
- St. Patrick's Blue#23297A
- Star Command Blue#007BB8
- Steel Blue#4682B4
- Traffic Blue#0E518D
- True Blue#0073CF
- Tufts Blue#417DC1
- Ultramarine Blue#4166F5
- Ultramarine Blue(caran D'ache)#2111EF
- United Nations Blue#5B92E5
- Vantg Blue#5271FF
- Very Light Azure#74BBFB
- Very Light Blue#6666FF
- Violet-blue#324AB2
- Violet-blue (Crayola)#766EC8
- Vista Blue#7C9ED9
- Wild Blue Yonder#A2ADD0
- Yale Blue#00356B
- Yinmn Blue#2E5090
- Zaffer (Zaffre)#0014A8
Every Blue by Lightness
The full blue range grouped from darkest to lightest. Lightness is the L in HSL — the fastest way to find a blue that will hold up as a background, a border, or body text against the rest of your palette.
Darkest · 0-20% lightness · 51 colors
- #00001F
- #000024
- #00002E
- #000033
- #000038
- #000042
- #000047
- #000052
- #000057
- #00005C
- #000061
- #001C38
- #001C3D
- #002147
- #002E57
- #003061
- #003153
- #010B13
- #020618
- #030712
- #032B45
- #05051A
- #052F4A
- #06061D
- #07193B
- #081335
- #09090B
- #0A0A2E
- #0B1F3A
- #0C0C3C
- #0D0D3B
- #0D1F54
- #0E0E48
- #0E1B25
- #0F073C
- #0F172B
- #100E20
- #101047
- #101828
- #130E2F
- #172436
- #181C20
- #182D3E
- #191632
- #1D293D
- #1E174A
- #1E2939
- #231E43
- #262B31
- #272E34
- #2A3439
Dark · 20-40% lightness · 103 colors
- #000066
- #000070
- #00007A
- #000080
- #00008B
- #000094
- #000099
- #00009C
- #00009E
- #0000B3
- #0000BD
- #000F89
- #0014A8
- #0018A8
- #002387
- #002395
- #003366
- #003399
- #00356B
- #0038A7
- #0038A8
- #00416A
- #004285
- #0047AB
- #0048BA
- #00549E
- #0057AD
- #00598A
- #006699
- #0067A5
- #0069A8
- #006DB0
- #0070B8
- #0072BB
- #0077BE
- #007BB8
- #01386A
- #024A70
- #035096
- #054A76
- #0769A6
- #082567
- #0B10A2
- #0C2B64
- #0E518D
- #0F52BA
- #1034A6
- #113C8D
- #1164B4
- #121254
- #12279E
- #13135E
- #132C77
- #154CB2
- #161664
- #162456
- #173796
- #18187B
- #184FA1
- #190B65
- #191970
- #191980
- #1B03A3
- #1C398E
- #1D2951
- #1E1A4D
- #1F1F9E
- #21314A
- #213D54
- #22229B
- #23108E
- #23297A
- #263C5A
- #26619C
- #2A2069
- #2B506E
- #2C2555
- #2E2D88
- #2E5090
- #2E5894
- #312C85
- #314158
- #32527B
- #333366
- #336084
- #352D67
- #353D45
- #364153
- #36454F
- #365781
- #372A89
- #374049
- #374F6B
- #3E3579
- #434C56
- #45556C
- #46525D
- #483D8B
- #4A5565
- #4C516D
- #525E6B
- #54626F
- #566371
Mid-tone · 40-60% lightness · 109 colors
- #0000CC
- #0000CD
- #0000DB
- #0000E6
- #0000EB
- #0000F0
- #0000F5
- #0000FF
- #0033CC
- #0033FF
- #0066CC
- #0066FF
- #0069D1
- #0073CF
- #0073E6
- #0078D7
- #0078E0
- #007DFA
- #0084D1
- #0099FF
- #0505FF
- #098BDC
- #0F0FFF
- #1447E6
- #155DFC
- #1560BD
- #193CB8
- #1974D2
- #1A5DDB
- #1C39BB
- #1D44B9
- #1E90FF
- #1F1FFF
- #1F75FE
- #2111EF
- #214FC6
- #2243B6
- #224FD8
- #23A5F6
- #2424B7
- #2424FF
- #2499FF
- #2626C0
- #273BE2
- #2887C8
- #2929FF
- #297EFF
- #2A52BE
- #2B2BC5
- #2B7FFF
- #2D14B8
- #318CE7
- #324AB2
- #3300FF
- #333399
- #3333CC
- #336699
- #3366CC
- #3399CC
- #3719E1
- #372AAC
- #3737D7
- #3B77E8
- #3C32CD
- #3C69E7
- #3D729E
- #3F3FD9
- #4169E1
- #417DC1
- #432DD7
- #4334A8
- #436B95
- #446CCF
- #456FA5
- #45B1E8
- #4682B4
- #4B4BD8
- #4B61D1
- #4B9CD3
- #4E3CC3
- #4E5180
- #4F39F6
- #4F69C6
- #5072A7
- #536878
- #5649A7
- #583EEA
- #5946B2
- #5A4FCF
- #5D89BA
- #5D8AA8
- #5D94C0
- #5F6E7C
- #6050DC
- #6082B6
- #62748E
- #64609A
- #648BBE
- #657586
- #666699
- #6A5ACD
- #6A7282
- #6F63BB
- #708090
- #777696
- #778899
- #778BA5
- #8391A0
- #8896A5
Light · 60-80% lightness · 97 colors
- #3333FF
- #3366FF
- #3399FF
- #3838FF
- #3D9EFF
- #4166F5
- #4747FF
- #4D4DFF
- #4F86F7
- #51A2FF
- #5271FF
- #54B9F8
- #5757FF
- #5959DE
- #5B92E5
- #5C5CFF
- #5C7EE6
- #5CADFF
- #5DADEC
- #615FFF
- #6161FF
- #6495ED
- #6666CC
- #6666FF
- #6699CC
- #6699FF
- #66B8FF
- #66CCFF
- #6B6BFF
- #6CA0DC
- #6D9BC3
- #7070FF
- #71A6D2
- #72A0C1
- #73C2FB
- #74ACDF
- #74BBFB
- #7575FF
- #766EC8
- #7693EA
- #7777E4
- #77A5CA
- #77B5FE
- #7979E2
- #7ABDFF
- #7B68EE
- #7B7BE5
- #7BA4EF
- #7C86FF
- #7C9ED9
- #7CB9E8
- #8073D4
- #80BFFF
- #8585FF
- #85B4FF
- #87CEFA
- #87D3F8
- #88A6CD
- #88ACE0
- #897FC7
- #8A8AFF
- #8BA8B7
- #8C7AF0
- #8C92AC
- #8DB0F2
- #8EC5FF
- #8F8FFF
- #90A1B9
- #9186DA
- #91A3B0
- #91A8EE
- #91B6D4
- #93CCEA
- #93D3FB
- #94B1FF
- #979AAA
- #97A3AF
- #9999CC
- #9999EB
- #99A1AF
- #9BC4E2
- #9CA8B4
- #A091F3
- #A1CAF1
- #A2A2D0
- #A2ADD0
- #A3A3EB
- #A69DE1
- #A69FD5
- #ABB5BF
- #ABC7DE
- #ACACE6
- #AEB8C2
- #B0C4DE
- #BDC4CC
- #C2C9D1
- #C4C3D0
Lightest · 80-100% lightness · 89 colors
- #9999FF
- #99CCFF
- #9BDDFF
- #9E9EFF
- #A3B3FF
- #A4C0F4
- #A7B9F1
- #A7DBFB
- #ABCDEF
- #ADADFF
- #ADD9FF
- #AEAEEF
- #AFA3F5
- #B3B3FF
- #B6CDF6
- #B6E1FC
- #B8DBFF
- #B8E6FE
- #BBBBF2
- #BBCCE2
- #BCB5E8
- #BCD4E6
- #BEB8FF
- #BEDBFF
- #C1BCE1
- #C1CEF5
- #C2C2FF
- #C3BAF7
- #C3CDE6
- #C4B4FF
- #C4D8E8
- #C4E7FD
- #C5CBE1
- #C5D4E7
- #C6D2FF
- #CAD5E2
- #CCCCFF
- #CDCDF4
- #CDDCF9
- #CEC8EF
- #D0DCEB
- #D1CCEF
- #D1D1FF
- #D1D5DC
- #D1D6DC
- #D3CDF9
- #D3D9DE
- #D3EDFD
- #D6D6FF
- #D6EBFF
- #D7E1EE
- #DBE4EB
- #DBEAFE
- #DCE3F9
- #DDD6FF
- #DDDDF8
- #DEDCEF
- #DEE9F2
- #DFE9FB
- #DFF2FE
- #E0E7FF
- #E2E8F0
- #E2E9F3
- #E3E0F5
- #E5E7EB
- #E5E8EB
- #E6E6FA
- #E7E3FC
- #E7F5FE
- #E8EBED
- #EAEAFB
- #EDE9FE
- #EDF2F7
- #EEEEFC
- #EEF2FF
- #EFF1FE
- #EFF6FF
- #F0F8FF
- #F0F9FF
- #F1F5F9
- #F2F2FC
- #F3F4F6
- #F5F3FF
- #F5F5FF
- #F5FAFF
- #F8F8FF
- #F8FAFC
- #F9FAFB
- #FAFAFF
Browse Another Family
Working with Blue
For the editorial guide — what blue signals, where it works, and what to pair it with — read shades of blue. To find a blue by name rather than by eye, use the A-Z index of color names. To build a palette around one, open any swatch and use the palette generator or check it in the contrast checker.