industryColor Scheme

Travel Adventure

An adventurous travel palette with oceanic blues and sunset warmth. Evokes wanderlust and the excitement of discovering new destinations.

#ffffff
#0ea5e9
#2563eb
#64748b
#f97316

Color Breakdown

Role

background

Name

White

Hex

#ffffff

Tailwind

bg-white

Role

surface

Name

Sky 500

Hex

#0ea5e9

Tailwind

bg-sky-500

Role

primary

Name

Blue 600

Hex

#2563eb

Tailwind

text-blue-600

Role

secondary

Name

Slate 500

Hex

#64748b

Tailwind

text-slate-500

Role

accent

Name

Orange 500

Hex

#f97316

Tailwind

bg-orange-500

Live Preview

Welcome Back

This is a live preview of the Travel Adventure color scheme applied to a sample card component. See how the colors work together in a realistic UI context.

Design Rationale

Sky and blue tones evoke oceans and clear skies, core travel imagery. Orange accents recall sunsets and adventure, driving booking urgency.

Use Cases

Travel booking sitesAdventure tour pagesDestination guides

CSS Variables

CSS
:root {
  --background: #ffffff;
  --surface: #0ea5e9;
  --primary: #2563eb;
  --secondary: #64748b;
  --accent: #f97316;
}

Tailwind Config

JavaScript
// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'travel-adventure': {
  'background': '#ffffff',  // bg-white
  'surface': '#0ea5e9',  // bg-sky-500
  'primary': '#2563eb',  // text-blue-600
  'secondary': '#64748b',  // text-slate-500
  'accent': '#f97316',  // bg-orange-500
        },
      },
    },
  },
};

Related Color Schemes

Build with This Scheme

Use our palette generator to customize and extend this color scheme for your project.

Open Palette Generator

Frequently Asked Questions

What colors work best for travel websites?
Blues evoke sky and sea while warm accents like orange create excitement and urgency for booking decisions.