Back to palettes

Palette

Viking Ship Voyage

Bold and rugged, inspired by the timbers and sails of a Viking longship on a cold, grey sea.

darkretro5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Viking Ship Voyage reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Viking Ship Voyage.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#5C4033#224A66#B22222#808080#E0E0E0

Palette guide

How to use Viking Ship Voyage

Overview

The Viking Ship Voyage palette is a bold and rugged collection, inspired by the timbers, sails, and the cold, grey sea encountered on ancient Norse journeys. It features the earthy #5C4033 (dark brown), the deep #224A66 (dark blue), and the impactful #B22222 (firebrick red). Neutral tones like #808080 (grey) and the crisp #E0E0E0 (light grey) provide balance and versatility. This palette is perfect for designers and developers looking to evoke a sense of history, adventure, and maritime strength. Its strong contrasts and natural hues make it ideal for projects that require a grounded yet adventurous feel, bringing to life the spirit of exploration and ancient craftsmanship.

Best used for

  • Adventure brand marketing and websites
  • Historical reenactment and museum exhibits
  • Rustic decor and artisan products
  • Maritime-themed gaming interfaces
  • Outdoor lifestyle brands
  • Documentary film branding for historical themes

Suggested color roles

primary

Use #224A66 as a strong, stable primary color, representing the deep sea or a foundational element.

secondary

Employ #5C4033 to provide earthy warmth and a sense of natural materials, like ship timbers.

accent

Apply #B22222 as a bold, impactful accent for calls to action, warning signs, or flag-like elements.

background

Utilize #E0E0E0 as a clean, light background, offering excellent contrast for darker text and elements.

text

For readability, use #5C4033 or #224A66 on light backgrounds, and white on darker tones like #5C4033 or #224A66.

Accessibility notes

  • Ensure #5C4033 or #224A66 text on #E0E0E0 has sufficient contrast to meet WCAG guidelines.
  • Be cautious using #808080 (grey) for small text on #E0E0E0 (light grey) due to potential low contrast.
  • Avoid using #B22222 (red) as the sole indicator for critical information due to potential color blindness issues.
  • Always test color combinations for text and interactive elements to ensure clarity and legibility.

Recommended combinations

Longship Timber

Combines the wood of the ship, the deep sea, and the sails, perfect for historical themes.

#5C4033 · #224A66 · #E0E0E0

Battle Ready

An impactful trio for action-oriented designs, blending bold red with deep blue and a neutral grey.

#B22222 · #224A66 · #808080

Cold Sea

Use for a cool, expansive feel, representing the ocean and the sky on a voyage.

#224A66 · #808080 · #E0E0E0

CSS variables

:root {
  --viking-ship-voyage-1: #5C4033;
  --viking-ship-voyage-2: #224A66;
  --viking-ship-voyage-3: #B22222;
  --viking-ship-voyage-4: #808080;
  --viking-ship-voyage-5: #E0E0E0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "viking-ship-voyage": {
        1: "#5C4033",
        2: "#224A66",
        3: "#B22222",
        4: "#808080",
        5: "#E0E0E0",
      }
    }
  }
}

Related searches

viking history colorsrustic maritime palettebold adventure colorslongship inspired designred and blue grey palette

Palette colors

Hex values

Color 1#5C4033
·
Color 2#224A66
·
Color 3#B22222
·
Color 4#808080
·
Color 5#E0E0E0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1:1Fail
1.4:1Fail
2.4:1Fail
7.1:1AAA
2
1:1Fail
1.4:1Fail
2.4:1Fail
7.1:1AAA
3
1.4:1Fail
1.4:1Fail
1.7:1Fail
5.1:1AA
4
2.4:1Fail
2.4:1Fail
1.7:1Fail
3:1Fail
5
7.1:1AAA
7.1:1AAA
5.1:1AA
3:1Fail

Similar palettes

More like Viking Ship Voyage

View all dark