---
url: 'https://piktochart.com/blog/shades-of-blue/'
title: The 25 Best Shades of Blue (+ HEX Codes)
author:
  name: Vinnie Wong
  url: 'https://piktochart.com/blog/author/vinniewong/'
date: '2026-04-21T16:46:55+00:00'
modified: '2026-04-21T17:21:22+00:00'
type: post
summary: 'Discover the 25 best shades of blue with HEX codes for your design projects. Perfect for web designers and color enthusiasts!'
categories:
  - Colors
image: 'https://piktochart.com/wp-content/uploads/2026/04/6711be9bb96ead61020b0f2e_airtable-8db31559c115a253152103fae9c69e0c-db2e8fen.jpeg'
published: true
---

# The 25 Best Shades of Blue (+ HEX Codes)

Blue is a versatile color that evokes a sense of calm and tranquility. From the deep hues of navy to the light tones of sky blue, each shade carries its own unique charm.

Exploring the various shades of blue can help you find the perfect tone for your design needs. Whether you’re aiming for a professional look or a more relaxed vibe, there’s a blue shade that fits the bill.

## 25 Shades of Blue

The spectrum of blue shades ranges from the lightest pastels to the deepest indigos, offering a wide array of options for any design context. Each shade brings its own unique quality, enhancing the overall aesthetic of your project.

Light blues can evoke feelings of serenity and openness, while darker blues often convey professionalism and depth. By carefully selecting the right shade, you can effectively communicate your desired message and mood.

### 1) Dodger Blue

![Dodger Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ad5f710cb9e4274bfbcabf_airtable-f7de27066f24de442a594f0d29e4951e-i6jzfsye.jpeg)

[Dodger Blue](https://piktochart.com/tips/what-color-is-dodger-blue) is a vibrant, medium-bright shade that stands out with its striking intensity. Its unique blend of vividness and clarity makes it perfect for drawing attention in digital designs. A potential use case for Dodger Blue is in call-to-action buttons, where its eye-catching quality can enhance user engagement.

### 2) Rich Black

![Rich Black](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ad5f71e7fe9c13c0c13b2a_airtable-4ff14dc1d590a1e4d9239e761432619d-ai2kbx4i.jpeg)

[Rich Black](https://piktochart.com/tips/what-color-is-rich-black) is a deep, dark shade that exudes sophistication and elegance. Its unique blend of blue undertones sets it apart from standard black, adding a subtle depth and richness. This shade is ideal for creating a dramatic backdrop in presentations or infographics, enhancing the overall visual impact.

### 3) Ocean Boat Blue

![Ocean Boat Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ad5f6cfddc770a018647d2_airtable-e0a0b8681b2ab833f7640d4eee86b324-kqcyltj4.jpeg)

[Ocean Boat Blue](https://piktochart.com/tips/what-color-is-ocean-boat-blue) is a rich, deep shade that combines the tranquility of blue with a hint of green, reminiscent of the ocean’s depths. Its unique blend of hues makes it stand out within the blue family, offering a sense of calm and sophistication. This shade is perfect for creating serene backgrounds in presentations or infographics, adding a touch of elegance and depth to your design.

### 4) True Blue

![True Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ad5f63f9bda3616d2ec9a4_airtable-55b8f6a699df0168b9c6c48bac4f1467-wuf3ehu1.jpeg)

[True Blue](https://piktochart.com/tips/what-color-is-true-blue) is a vivid, pure shade that embodies clarity and brightness. Its striking intensity sets it apart within the blue family, making it ideal for creating bold, attention-grabbing elements in your designs. A potential use case for True Blue is in headers or titles, where its vibrant hue can draw the viewer’s eye and emphasize key information.

### 5) Sapphire

![Sapphire](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ad5f60dce4583adcb9f5f7_airtable-de2ec21555f23f6ec8a6695666a22e9c-vcx32srj.jpeg)

[Sapphire](https://piktochart.com/tips/what-color-is-sapphire) is a deep, rich shade of blue that exudes luxury and elegance. Its unique blend of intensity and depth makes it stand out within the blue family, offering a sense of sophistication. This shade is perfect for creating striking visual elements in high-end branding or luxury product designs.

### 6) Maya Blue

![Maya Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ad5f5f782e5f05e4884e12_airtable-55ee1a1132eb7266939df464ba0b46dc-glfgtqjy.jpeg)

[Maya Blue](https://piktochart.com/tips/what-color-is-maya-blue) is a soft, muted shade that combines the tranquility of blue with a hint of green, creating a serene and timeless hue. Its unique blend of subtlety and calmness makes it perfect for backgrounds in presentations or infographics, where a soothing and unobtrusive color is desired.

### 7) Smalt

![Smalt](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ad5f5f63b43014d2c7c20d_airtable-e7bd46b02ed7846151201a7544fb870c-voijjzbd.jpeg)

[Smalt](https://piktochart.com/tips/what-color-is-smalt) is a deep, vibrant shade of blue with a hint of purple, giving it a unique and striking appearance within the blue family. Its rich and intense hue makes it ideal for creating bold accents in digital designs, such as highlighting key information or adding depth to visual elements.

### 8) Zaffre

![Zaffre](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e49106c6e914e1cef7b_airtable-4ed7337cd3c32bb8bf531b4b3210a7b9-v6l7o9ua.jpeg)

[Zaffre](https://piktochart.com/tips/what-color-is-zaffre) is a deep, intense shade of blue with a slight hint of indigo, giving it a rich and captivating appearance. Its unique blend of depth and vibrancy makes it stand out within the blue family. This shade is perfect for creating striking visual elements in high-impact presentations or branding materials, where a bold and sophisticated color is desired.

### 9) Egyptian Blue

![Egyptian Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e38511fdd69c8faf2e4_airtable-5394c43451fabf1ca4c9f9a0421a2aad-rksqhtvf.jpeg)

[Egyptian Blue](https://piktochart.com/tips/what-color-is-egyptian-blue) is a vivid, deep shade that combines the richness of blue with subtle green undertones, creating a unique and captivating hue. Its historical significance and striking appearance make it perfect for adding a touch of timeless elegance to your designs. A potential use case for Egyptian Blue is in creating sophisticated backgrounds for presentations or infographics, where its depth and vibrancy can enhance the overall visual appeal.

### 10) Azure

![Azure](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e2f6d7a053ed9e3ddd2_airtable-f93811be6296f5ee37057abc4a01fb0f-fulmi7to.jpeg)

[Azure](https://piktochart.com/tips/what-color-is-azure) is a bright, clear shade of blue that evokes the crispness of a cloudless sky. Its unique blend of lightness and vibrancy makes it stand out within the blue family. This shade is perfect for creating refreshing and inviting backgrounds in digital designs, enhancing the overall visual appeal with its lively hue.

### 11) Cerulean

![Cerulean](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e348f4a9d5c3652b3f2_airtable-1b27301105dc5a049b052259409b101e-k7f93sqm.jpeg)

[Cerulean](https://piktochart.com/tips/what-color-is-cerulean) is a serene, sky-like shade of blue that combines the tranquility of light blue with a hint of green, creating a refreshing and calming hue. Its unique blend of softness and vibrancy makes it stand out within the blue family. This shade is perfect for creating soothing backgrounds in presentations or infographics, where a peaceful and inviting atmosphere is desired.

### 12) CG Blue

![CG Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e35d9a150d1ec5f7c1c_airtable-c847ad0c7b8a5c7e9a0e50a6863d1dec-tb6jtubq.jpeg)

[CG Blue](https://piktochart.com/tips/what-color-is-cg-blue) is a vibrant, medium-dark shade that combines the depth of navy with a hint of teal, creating a unique and captivating hue. Its striking blend of intensity and subtlety makes it perfect for highlighting key elements in digital designs, such as call-to-action buttons or important information.

### 13) Bondi Blue

![Bondi Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e316d1b3e37580ffea8_airtable-251a422f3db8f4d23bd2eab1797df651-4feft34s.jpeg)

[Bondi Blue](https://piktochart.com/tips/what-color-is-bondi-blue) is a vibrant, medium-light shade that combines the freshness of turquoise with a hint of green, creating a lively and refreshing hue. Its unique blend of brightness and subtlety makes it stand out within the blue family. This shade is perfect for creating eye-catching call-to-action buttons or accent elements in digital designs, where a touch of energy and clarity is desired.

### 14) Ball Blue

![Ball Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e2fc2314bfc3905ce4a_airtable-4120d5662a00d8f43457859831d734ac-8zaa6qgj.jpeg)

[Ball Blue](https://piktochart.com/tips/what-color-is-ball-blue) is a soft, muted shade that combines the tranquility of blue with a hint of gray, creating a calming and sophisticated hue. Its unique blend of subtlety and elegance makes it stand out within the blue family. This shade is perfect for creating serene backgrounds in presentations or infographics, where a touch of understated refinement is desired.

### 15) UA Blue

![UA Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66b41e48b7e26055e5d0b415_airtable-ee2576ac1770c9bb60f131e898a673ba-lyjhytcf.jpeg)

[UA Blue](https://piktochart.com/tips/what-color-is-ua-blue) is a deep, rich shade that combines the intensity of navy with a hint of vibrancy, creating a striking and authoritative hue. Its unique blend of depth and brightness makes it stand out within the blue family. This shade is perfect for creating bold headers or accent elements in professional presentations, where a touch of sophistication and clarity is desired.

### 16) Sea Blue

![Sea Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ba78f1ce9c90c99a2dc792_airtable-6c15425fe6184d92cea1c562b9722356-jdt8kvxb.jpeg)

[Sea Blue](https://piktochart.com/tips/what-color-is-sea-blue) is a vibrant, medium-dark shade that combines the depth of navy with a hint of teal, creating a unique and captivating hue. Its striking blend of intensity and subtlety makes it perfect for highlighting key elements in digital designs, such as call-to-action buttons or important information.

### 17) Cobalt

![Cobalt](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ba78e0c939c2594495d105_airtable-cf54044d1953eb54e285729984113eb3-ohfekn1x.jpeg)

[Cobalt](https://piktochart.com/tips/what-color-is-cobalt) is a vibrant, deep shade of blue with a slight hint of purple, giving it a rich and striking appearance. Its unique blend of intensity and depth makes it stand out within the blue family. This shade is perfect for creating bold, eye-catching elements in digital designs, such as headers or call-to-action buttons, where a touch of sophistication and clarity is desired.

### 18) Pacific Blue

![Pacific Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ba78eca231eb30e99e0f86_airtable-10297aca1bb41bcded8e387ce0d869a0-wvjhtzec.jpeg)

[Pacific Blue](https://piktochart.com/tips/what-color-is-pacific-blue) is a vibrant, medium-dark shade that combines the depth of navy with a hint of teal, creating a unique and captivating hue. Its striking blend of intensity and subtlety makes it perfect for highlighting key elements in digital designs, such as call-to-action buttons or important information.

### 19) Bleu De France

![Bleu De France](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66c39cad14e1f09cb3c079dd_airtable-6afa2404b1d3620df801a5b7f3dfcaa2-ys6gharb.jpeg)

[Bleu De France](https://piktochart.com/tips/what-color-is-bleu-de-france) is a vivid, medium-bright shade of blue that exudes elegance and sophistication. Its unique blend of brightness and depth makes it stand out within the blue family. This shade is perfect for creating striking visual elements in branding or digital designs, where a touch of refined vibrancy is desired.

### 20) Brandeis Blue

![Brandeis Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66ce238f34341ef3977107c1_airtable-09dd52750a51f6c000b2cd1496711d74-nwhj60i6.jpeg)

[Brandeis Blue](https://piktochart.com/tips/what-color-is-brandeis-blue) is a vivid, medium-bright shade that stands out with its striking intensity and clarity. Its unique blend of brightness and depth makes it a captivating choice within the blue family. This shade is perfect for creating bold, attention-grabbing elements in digital designs, such as headers or call-to-action buttons, where a touch of vibrant energy is desired.

### 21) Royal Azure

![Royal Azure](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66c39cc46048052daa496587_airtable-c9a7ea1934d59c2c09b4431ee50980fd-bt4bip61.jpeg)

[Royal Azure](https://piktochart.com/tips/what-color-is-royal-azure) is a vivid, deep shade of blue that combines the richness of sapphire with a hint of purple, creating a regal and captivating hue. Its unique blend of intensity and elegance makes it stand out within the blue family. This shade is perfect for creating striking visual elements in luxury branding or high-end product designs, where a touch of sophistication and depth is desired.

### 22) Rich Electric Blue

![Rich Electric Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66d5f0860ac2c9392085b5f0_airtable-2d5beec5dd89a0c70710484ae5fb49f1-kgfuilll.jpeg)

[Rich Electric Blue](https://piktochart.com/tips/what-color-is-rich-electric-blue) is a vibrant, intense shade that combines the brightness of electric blue with a deep, rich undertone. Its unique blend of vividness and depth makes it stand out within the blue family. This shade is perfect for creating eye-catching call-to-action buttons or accent elements in digital designs, where a touch of dynamic energy is desired.

### 23) Medium Electric Blue

![Medium Electric Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66df38e92ef7fd70396d0c2b_airtable-b96e77652591959fe97d14bc5611447b-xk3ws6s5.jpeg)

[Medium Electric Blue](https://piktochart.com/tips/what-color-is-medium-electric-blue) is a vibrant, medium-bright shade that combines the intensity of electric blue with a subtle depth, creating a striking and dynamic hue. Its unique blend of brightness and richness makes it stand out within the blue family. This shade is perfect for creating eye-catching call-to-action buttons or accent elements in digital designs, where a touch of energetic vibrancy is desired.

### 24) Prussian Blue

![Prussian Blue](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66df38f03335bb58e16dcfef_airtable-8222569e5820b9746dbad0ec06bd9990-7jo0e2qm.jpeg)

[Prussian Blue](https://piktochart.com/tips/what-color-is-prussian-blue) is a deep, dark shade with a slight greenish undertone, giving it a rich and mysterious appearance. Its unique blend of depth and subtle vibrancy makes it stand out within the blue family. This shade is perfect for creating dramatic backgrounds in presentations or infographics, adding a touch of sophistication and intrigue to your design.

### 25) Ultramarine

![Ultramarine](https://cdn.prod.website-files.com/66671b800c367e1fd46c54bc/66df38f4e6510fbc17d92b09_airtable-3c1b8e75b147662d78cf33c7b474e70c-rlj9rfmu.jpeg)

[Ultramarine](https://piktochart.com/tips/what-color-is-ultramarine) is a vivid, deep shade of blue with a slight hint of purple, giving it a rich and striking appearance. Its unique blend of intensity and depth makes it stand out within the blue family. This shade is perfect for creating bold, eye-catching elements in digital designs, such as headers or call-to-action buttons, where a touch of sophistication and clarity is desired.

## How to Use These Shades of Blue

Incorporating shades of blue into your branding can evoke a sense of trust and professionalism. For instance, using [True Blue](https://piktochart.com/tips/what-color-is-true-blue) in your logo or marketing materials can help create a bold and memorable impression.

Web design projects can benefit greatly from the versatility of blue shades. Consider using [Dodger Blue](https://piktochart.com/tips/what-color-is-dodger-blue) for call-to-action buttons to draw attention, or [Azure](https://piktochart.com/tips/what-color-is-azure) for refreshing and inviting backgrounds.

For interior decor, blue shades can transform a space into a serene and sophisticated environment. [Sapphire](https://piktochart.com/tips/what-color-is-sapphire) can add a touch of luxury to your decor, while [Maya Blue](https://piktochart.com/tips/what-color-is-maya-blue) can create a calming and timeless atmosphere.

## Use These Shades of Blue in Your Piktochart Projects

Incorporating the diverse shades of blue into your Piktochart projects can elevate your designs, making them more engaging and visually appealing. Whether you’re creating infographics, reports, or presentations, the right shade of blue can convey the perfect mood and message.

From the calming tones of Maya Blue to the striking intensity of Rich Electric Blue, there’s a shade for every design need. Ready to transform your ideas into captivating visuals? [Try Piktochart](https://piktochart.com/) and start designing with these stunning shades of blue today!