3
Back

Gradient #11

glow-pluto-dusk

radial-glow-pluto-dusk

Copy styles

Tailwind
bg-[radial-gradient(44%_60%_at_14%_10%,rgba(167,139,250,0.62)_0%,rgba(167,139,250,0)_100%),radial-gradient(52%_68%_at_86%_16%,rgba(96,165,250,0.46)_0%,rgba(96,165,250,0)_100%),radial-gradient(76%_98%_at_50%_88%,rgba(216,180,254,0.42)_0%,rgba(216,180,254,0)_100%),linear-gradient(150deg,#f5f3ff_0%,#e9d5ff_50%,#dbeafe_100%)] border border-solid border-[rgba(124,58,237,0.24)] shadow-[0_0_0_1px_rgba(167,139,250,0.14),0_14px_34px_-18px_rgba(91,33,182,0.56),0_0_42px_rgba(129,140,248,0.24)]
CSS3
.radial-glow-pluto-dusk {

  background-image:
    radial-gradient(44% 60% at 14% 10%, rgba(167, 139, 250, 0.62) 0%, rgba(167, 139, 250, 0) 100%),
    radial-gradient(52% 68% at 86% 16%, rgba(96, 165, 250, 0.46) 0%, rgba(96, 165, 250, 0) 100%),
    radial-gradient(76% 98% at 50% 88%, rgba(216, 180, 254, 0.42) 0%, rgba(216, 180, 254, 0) 100%),
    linear-gradient(150deg, #f5f3ff 0%, #e9d5ff 50%, #dbeafe 100%);
  border: 1px solid rgba(124, 58, 237, 0.24);
  box-shadow: 0 0 0 1px rgba(167, 139, 250, 0.14), 0 14px 34px -18px rgba(91, 33, 182, 0.56), 0 0 42px rgba(129, 140, 248, 0.24);
}