Royal Blue Color Palette
A commanding royal blue palette with regal depth. Perfect for government, education, and enterprise brands.
Navy
HEX: #1e3a5f
RGB: rgb(30, 58, 95)
HSL: hsl(214, 52%, 25%)
Deep Royal
HEX: #1d4ed8
RGB: rgb(29, 78, 216)
HSL: hsl(224, 76%, 48%)
Royal Blue
HEX: #2563eb
RGB: rgb(37, 99, 235)
HSL: hsl(221, 83%, 53%)
Sky Royal
HEX: #60a5fa
RGB: rgb(96, 165, 250)
HSL: hsl(213, 94%, 68%)
Blue Wash
HEX: #bfdbfe
RGB: rgb(191, 219, 254)
HSL: hsl(213, 97%, 87%)
CSS Variables
:root {
--royal-blue-1: #1e3a5f;
--royal-blue-2: #1d4ed8;
--royal-blue-3: #2563eb;
--royal-blue-4: #60a5fa;
--royal-blue-5: #bfdbfe;
}Tailwind CSS Config
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'royal-blue': {
'100': '#1e3a5f',
'200': '#1d4ed8',
'300': '#2563eb',
'400': '#60a5fa',
'500': '#bfdbfe',
},
},
},
},
}Use Cases
Government sites
Education platforms
Enterprise software
Banking
Related Palettes
Frequently Asked Questions
Why is royal blue associated with authority?▾
Historically, blue dyes were expensive and reserved for royalty and nobility. This association with prestige and authority persists in modern branding.
How does royal blue differ from navy?▾
Royal blue is brighter and more saturated than navy. Navy is darker and more subdued. Royal blue commands attention while navy conveys quiet authority.