Blue & Orange Color Palette
Complementary blue and orange create maximum visual tension and energy, a proven combination in sports and tech. This high-contrast duo demands attention for call-to-action buttons and bold branding.
#2962FF
Vivid Blue
RGB(41, 98, 255)
HSL(224, 100%, 58%)
#448AFF
Vivid Blue
RGB(68, 138, 255)
HSL(218, 100%, 63%)
#FF6D00
Vivid Vermilion
RGB(255, 109, 0)
HSL(26, 100%, 50%)
#FF9E40
Vivid Vermilion
RGB(255, 158, 64)
HSL(30, 100%, 63%)
#E8F0FF
Light Blue
RGB(232, 240, 255)
HSL(219, 100%, 95%)
#FFF3E0
Light Orange
RGB(255, 243, 224)
HSL(37, 100%, 94%)
lightbulbBest Use Cases
- checkSports branding
- checkTech dashboards
- checkCTA design
businessIndustries
- checkSports
- checkTechnology
Mood:energetic
codeUse in Your Code
CSS Custom Properties
:root {
--color-1: #2962FF;
--color-2: #448AFF;
--color-3: #FF6D00;
--color-4: #FF9E40;
--color-5: #E8F0FF;
--color-6: #FFF3E0;
}Tailwind CSS Config
colors: {
'blue-and-orange-1': '#2962FF',
'blue-and-orange-2': '#448AFF',
'blue-and-orange-3': '#FF6D00',
'blue-and-orange-4': '#FF9E40',
'blue-and-orange-5': '#E8F0FF',
'blue-and-orange-6': '#FFF3E0',
}blueorangecomplementaryenergeticbold
Want to Extract Colors from Your Own Images?
Upload any photo and get a custom color palette instantly — free.
Try PaletteAI Free