Back to palettes

Palette

Stormy Ocean Fury

Captures the ominous, powerful atmosphere of a turbulent ocean during a fierce storm.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Stormy Ocean Fury 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 Stormy Ocean Fury.

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

Data visualization

#34495E#5D6D7E#85929E#2C3E50#1F2E3D

Palette guide

How to use Stormy Ocean Fury

Overview

The Stormy Ocean Fury palette vividly captures the raw power and ominous atmosphere of a turbulent ocean under a fierce storm. This collection is steeped in deep, cool blues and grays, ranging from the commanding dark blue-grey of #1F2E3D to the lighter, misty #85929E. The core of the palette, including #34495E, #5D6D7E, and #2C3E50, provides a rich, varied gradient that conveys depth and intensity. Ideal for designers and developers seeking to evoke drama, strength, or a sophisticated, moody aesthetic, these hex codes are excellent for impactful branding, immersive digital environments, or visual narratives that demand attention. It’s a versatile set for conveying both power and understated elegance.

Best used for

  • Action movie promotional materials
  • Adventure sports brand identity
  • Weather simulation software interfaces
  • Luxury outdoor gear websites
  • Dramatic photography portfolios
  • Dark-themed mobile applications

Suggested color roles

primary

Utilize #1F2E3D as the primary dark anchor for backgrounds or main structural elements, conveying profound depth and authority.

secondary

Apply #2C3E50 for supporting sections, large text areas, or as a contrasting dark background, maintaining a cohesive dark theme.

accent

Introduce #85929E sparingly for interactive elements, hover states, or subtle highlights, providing a necessary point of visual interest.

background

Employ #34495E for atmospheric backgrounds, or #5D6D7E for slightly lighter content blocks that still maintain the moody aesthetic.

text

For readability on darker shades like #1F2E3D, use a crisp white or a very light grey. For text on #85929E, #1F2E3D offers excellent contrast.

Accessibility notes

  • Ensure white text on #1F2E3D and #2C3E50 backgrounds meets WCAG AA contrast for legibility.
  • Avoid using #5D6D7E for small text on #85929E backgrounds, as contrast may be insufficient for accessibility.
  • All interactive elements must have clear focus and hover states with adequate contrast from their surroundings.
  • Verify that essential information always maintains high contrast, especially against the darker palette tones.

Recommended combinations

Dramatic Core

For powerful branding: #1F2E3D for backgrounds, #85929E for key elements/text, and #34495E for supporting blocks.

#1F2E3D · #85929E · #34495E

Layered Depth

Ideal for multi-layered UI, with #2C3E50 as base, #5D6D7E for content, and #85929E for subtle accents.

#2C3E50 · #5D6D7E · #85929E

Accent Contrast

Use #1F2E3D for strong text or backgrounds, #85929E for highlights, and #5D6D7E for secondary elements.

#1F2E3D · #85929E · #5D6D7E

CSS variables

:root {
  --stormy-ocean-fury-1: #34495E;
  --stormy-ocean-fury-2: #5D6D7E;
  --stormy-ocean-fury-3: #85929E;
  --stormy-ocean-fury-4: #2C3E50;
  --stormy-ocean-fury-5: #1F2E3D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "stormy-ocean-fury": {
        1: "#34495E",
        2: "#5D6D7E",
        3: "#85929E",
        4: "#2C3E50",
        5: "#1F2E3D",
      }
    }
  }
}

Related searches

stormy ocean color schemedark dramatic blue greymoody cool tones palettepowerful marine aestheticturbulent sea design colors

Palette colors

Hex values

Color 1#34495E
·
Color 2#5D6D7E
·
Color 3#85929E
·
Color 4#2C3E50
·
Color 5#1F2E3D
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.9:1Fail
1.2:1Fail
1.5:1Fail
2
1.7:1Fail
1.7:1Fail
2.1:1Fail
2.6:1Fail
3
2.9:1Fail
1.7:1Fail
3.5:1AA18
4.4:1AA18
4
1.2:1Fail
2.1:1Fail
3.5:1AA18
1.3:1Fail
5
1.5:1Fail
2.6:1Fail
4.4:1AA18
1.3:1Fail

Similar palettes

More like Stormy Ocean Fury

View all dark
Stormy Sea Abyss
Tempestuous Sea Depths
Tempestuous Sky Fury
Abyssal Trench Mystery
City Puddle Reflection
Deep Ocean Trench