Modern Gradients Library 🎨

A curated collection of vibrant, ready-to-use gradients powered by Pumki UI.

Copy the Tailwind, CSS, or SASS classes and bring your UI to life in seconds.

Teal Gradients

Harmonic Energy

#16A085, #F4D03F

bg-gradient-to-r from-[#16A085] to-[#F4D03F]

Mint Whisper

#c2e9fb, #ffffff

bg-gradient-to-r from-[#c2e9fb] to-[#ffffff]

Khushi

#00F5A0, #00D9F5

bg-gradient-to-r from-[#00F5A0] to-[#00D9F5]

Ujjwal

#334d50, #cbcaa5

bg-gradient-to-r from-[#334d50] to-[#cbcaa5]

Windy

#acb6e5, #86fde8

bg-gradient-to-r from-[#acb6e5] to-[#86fde8]

Sky

#076585, #fff

bg-gradient-to-r from-[#076585] to-[#fff]

Sea Blue

#2b5876, #4e4376

bg-gradient-to-r from-[#2b5876] to-[#4e4376]

Nimvelo

#314755, #26a0da

bg-gradient-to-r from-[#314755] to-[#26a0da]

Hazel

#77A1D3, #79CBCA, #E684AE

bg-gradient-to-r from-[#77A1D3] via-[#79CBCA] to-[#E684AE]

Green Beach

#02AAB0, #00CDAC

bg-gradient-to-r from-[#02AAB0] to-[#00CDAC]

Aqua Marine

#1A2980, #26D0CE

bg-gradient-to-r from-[#1A2980] to-[#26D0CE]

Sea Weed

#4CB8C4, #3CD3AD

bg-gradient-to-r from-[#4CB8C4] to-[#3CD3AD]

Mojito

#1D976C, #93F9B9

bg-gradient-to-r from-[#1D976C] to-[#93F9B9]

Venice Blue

#085078, #85D8CE

bg-gradient-to-r from-[#085078] to-[#85D8CE]

Bora Bora

#2BC0E4, #EAECC6

bg-gradient-to-r from-[#2BC0E4] to-[#EAECC6]

Moss

#134E5E, #71B280

bg-gradient-to-r from-[#134E5E] to-[#71B280]

Sea Blizz

#1CD8D2, #93EDC7

bg-gradient-to-r from-[#1CD8D2] to-[#93EDC7]

Mantle

#24C6DC, #514A9D

bg-gradient-to-r from-[#24C6DC] to-[#514A9D]

Calm Darya

#5f2c82, #49a09d

bg-gradient-to-r from-[#5f2c82] to-[#49a09d]

Miaka

#FC354C, #0ABFBC

bg-gradient-to-r from-[#FC354C] to-[#0ABFBC]

Aqualicious

#50C9C3, #96DEDA

bg-gradient-to-r from-[#50C9C3] to-[#96DEDA]

Moor

#616161, #9bc5c3

bg-gradient-to-r from-[#616161] to-[#9bc5c3]

Winter

#E6DADA, #274046

bg-gradient-to-r from-[#E6DADA] to-[#274046]

Reef

#00d2ff, #3a7bd5

bg-gradient-to-r from-[#00d2ff] to-[#3a7bd5]

Teal Love

#AAFFA9, #11FFBD

bg-gradient-to-r from-[#AAFFA9] to-[#11FFBD]

Neon Life

#B3FFAB, #12FFF7

bg-gradient-to-r from-[#B3FFAB] to-[#12FFF7]

Friday

#83a4d4, #b6fbff

bg-gradient-to-r from-[#83a4d4] to-[#b6fbff]

Between The Clouds

#73C8A9, #373B44

bg-gradient-to-r from-[#73C8A9] to-[#373B44]

Purple Bliss

#360033, #0b8793

bg-gradient-to-r from-[#360033] to-[#0b8793]

Endless River

#43cea2, #185a9d

bg-gradient-to-r from-[#43cea2] to-[#185a9d]

Vine

#00bf8f, #001510

bg-gradient-to-r from-[#00bf8f] to-[#001510]

Turquoise flow

#136a8a, #267871

bg-gradient-to-r from-[#136a8a] to-[#267871]

Fresh Turboscent

#F1F2B5, #135058

bg-gradient-to-r from-[#F1F2B5] to-[#135058]

Lizard

#304352, #d7d2cc

bg-gradient-to-r from-[#304352] to-[#d7d2cc]

Back To Earth

#00C9FF, #92FE9D

bg-gradient-to-r from-[#00C9FF] to-[#92FE9D]

Pizelex

#114357, #F29492

bg-gradient-to-r from-[#114357] to-[#F29492]

Ganga Dolphins

#4DA0B0, #D39D38

bg-gradient-to-r from-[#4DA0B0] to-[#D39D38]

Decent

#4CA1AF, #C4E0E5

bg-gradient-to-r from-[#4CA1AF] to-[#C4E0E5]

Kanha

#ff4b1f, #1fddff

bg-gradient-to-r from-[#ff4b1f] to-[#1fddff]

Transfile

#16BFFD, #CB3066

bg-gradient-to-r from-[#16BFFD] to-[#CB3066]

Bright Vault

#00d2ff, #928DAB

bg-gradient-to-r from-[#00d2ff] to-[#928DAB]

Deep Sea Space

#2C3E50, #4CA1AF

bg-gradient-to-r from-[#2C3E50] to-[#4CA1AF]

Ocean Depths

#006A6B, #0891B2, #33D4FF

bg-gradient-to-r from-[#006A6B] via-[#0891B2] to-[#33D4FF]

Arctic Aurora

#00F5FF, #00CED1, #20B2AA

bg-gradient-to-r from-[#00F5FF] via-[#00CED1] to-[#20B2AA]

Tropical Paradise

#00B4DB, #0083B0, #00A8CC

bg-gradient-to-r from-[#00B4DB] via-[#0083B0] to-[#00A8CC]

Emerald City

#11998e, #38ef7d, #7fefb2

bg-gradient-to-r from-[#11998e] via-[#38ef7d] to-[#7fefb2]

Midnight Blue

#191654, #43C6AC, #F8FFAE

bg-gradient-to-r from-[#191654] via-[#43C6AC] to-[#F8FFAE]

Glacier Ice

#F0F8FF, #E0FFFF, #B0E0E6

bg-gradient-to-r from-[#F0F8FF] via-[#E0FFFF] to-[#B0E0E6]

Neon Nights

#FF1493, #00FFFF, #ADFF2F

bg-gradient-to-r from-[#FF1493] via-[#00FFFF] to-[#ADFF2F]