3
Back

Gradient #28

glow-quartz-nebula

radial-glow-quartz-nebula

Copy styles

Tailwind
bg-[radial-gradient(46%_62%_at_14%_10%,rgba(244,114,182,0.56)_0%,rgba(244,114,182,0)_100%),radial-gradient(50%_66%_at_86%_14%,rgba(125,211,252,0.46)_0%,rgba(125,211,252,0)_100%),radial-gradient(76%_98%_at_50%_88%,rgba(196,181,253,0.4)_0%,rgba(196,181,253,0)_100%),linear-gradient(150deg,#fdf2f8_0%,#eef2ff_52%,#e0f2fe_100%)] border border-solid border-[rgba(168,85,247,0.23)] shadow-[0_0_0_1px_rgba(244,114,182,0.12),0_14px_34px_-18px_rgba(91,33,182,0.5),0_0_40px_rgba(125,211,252,0.22)]
CSS3
.radial-glow-quartz-nebula {

  background-image:
    radial-gradient(46% 62% at 14% 10%, rgba(244, 114, 182, 0.56) 0%, rgba(244, 114, 182, 0) 100%),
    radial-gradient(50% 66% at 86% 14%, rgba(125, 211, 252, 0.46) 0%, rgba(125, 211, 252, 0) 100%),
    radial-gradient(76% 98% at 50% 88%, rgba(196, 181, 253, 0.4) 0%, rgba(196, 181, 253, 0) 100%),
    linear-gradient(150deg, #fdf2f8 0%, #eef2ff 52%, #e0f2fe 100%);
  border: 1px solid rgba(168, 85, 247, 0.23);
  box-shadow: 0 0 0 1px rgba(244, 114, 182, 0.12), 0 14px 34px -18px rgba(91, 33, 182, 0.5), 0 0 40px rgba(125, 211, 252, 0.22);
}