3
Back

Gradient #42

hero-elegant

radial-hero-elegant

Copy styles

Tailwind
bg-[radial-gradient(_120%_120%_at_70%_0%,rgba(99,102,241,0.18)_0%,rgba(168,85,247,0.12)_35%,rgba(255,255,255,0)_70%_),radial-gradient(_140%_140%_at_30%_20%,rgba(236,254,255,0.9)_0%,rgba(224,242,254,0.7)_55%,rgba(186,230,253,0.85)_100%_)] [backdrop-filter:blur(6px)] [-webkit-backdrop-filter:blur(6px)]
CSS3
.radial-hero-elegant {

    background-image:
      radial-gradient(
        120% 120% at 70% 0%,
        rgba(99,102,241,0.18) 0%,
        rgba(168,85,247,0.12) 35%,
        rgba(255,255,255,0) 70%
      ),
      radial-gradient(
        140% 140% at 30% 20%,
        rgba(236,254,255,0.9) 0%,
        rgba(224,242,254,0.7) 55%,
        rgba(186,230,253,0.85) 100%
      );
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}