Tailwind Classes

bg-[linear-gradient(to_right,_rgba(59,130,246,1)_0%,_rgba(139,92,246,1)_50%,_rgba(217,70,239,1)_100%)]

CSS Style

background: linear-gradient(to right, rgba(59, 130, 246, 1) 0%, rgba(139, 92, 246, 1) 50%, rgba(217, 70, 239, 1) 100%);

Gradient Generator

Color Stops

Position: 0%(0 / 100)
Opacity: 100%(0 / 100)
Position: 50%(0 / 100)
Opacity: 100%(0 / 100)
Position: 100%(0 / 100)
Opacity: 100%(0 / 100)

Gradient Gallery

Collection of ready-to-use Tailwind gradients. Copy and use them directly in your project! You can bookmark this page so you'll always have quick access to gradients when you need them!

Sunset

Ocean

Dusk

Sunrise

Cool Water

Warm Sand

Tropical Rainforest

Desert

Iceberg

The Danny

Peachy

Midnight Sky

Limeade

Slate Sunset

Stone Ocean

Zinc Forest

Concrete Rose

Silver Dawn

Coral Reef

Cool Mint

Dark Cherry Blossom

Deep Sea

Citrus

Violet

Gunmetal

Brass Plate

Plate Armor

Lemon Chiffon

Blueberry Smoothie

Minty Fresh

Rose Petal

Orange Creamsicle

Lavender Field

Cotton Candy

Raspberry Sorbet

Zinc Amber

Rust

Ocean Breeze

Cherry Blossom

Emerald City

Sunflower Field

Tropical Sunrise

Mojito

Blue Lagoon

Strawberry Shortcake

Peach Parfait

Grape Soda

Pina Colada

Space

Blue, White Split

Midnight

Powerpuff

Gotham

Sky Sea

Neon Radial

Bubblegum

High Tide

Peach Pie

Conic Midnight

Conic Rainbow

;
TemplateSee

TemplateSee offers high-quality, fully responsive, and customizable website templates for developers, freelancers, and businesses. Save time, build faster, and launch smarter with our ready-to-use designs! 🚀

© 2025 All Rights Reserved | TemplateSee