Launching soon on Product Hunt! - Get Notified

Dark Ocean

Dark Ocean meets Cornflower Blue, a deep dive into a vibrant, aquatic adventure.

๐ŸŽจ Great for a bold, dynamic website theme.

๐Ÿ’ก This gradient mimics the deep ocean meeting the sky, a natural phenomenon seen at dawn.

CSS Linear Gradient Code

/* Dark Ocean CSS Linear Gradient Background */
.gradient {
  background: #373B44;
  background: linear-gradient(
    to right,
    #373B44,#4286f4
  );
}

TailwindCSS Logo TailwindCSS Linear Gradient

/* Dark Ocean TailwindCSS Linear Gradient */
<div class="bg-gradient-to-r from-[#373B44] to-[#4286f4]"></div>

Dark Ocean - UI Design Examples

You can use this gradient in your UI design in many ways, for example as a background in a tweet, for buttons or as a text gradient.

Tweet Background Generator

Ilias Ism
Ilias Ism
@illyism
I love this Dark Ocean color palette gradient background ๐Ÿ‘
July 17, 2024 at 7:31 PM

CSS Linear Gradient Button

Home
Why Dark Ocean?

Linear Gradient Border

Dark Ocean
Share

CSS Font Gradient

The Best Dark Ocean Tailwind CSS Landing Pages

Shade of Dark Ocean

We hope you enjoyed Dark Ocean. Keep reading for more amazing colorful content for developers, designers and creators!
View our entire collection of UI gradientsView all our color names