3
Back

Gradient #5

glow-cobalt-beam

radial-glow-cobalt-beam

Copy styles

Tailwind
bg-[radial-gradient(45%_62%_at_16%_18%,rgba(96,165,250,0.66)_0%,rgba(96,165,250,0)_100%),radial-gradient(50%_68%_at_82%_14%,rgba(59,130,246,0.58)_0%,rgba(59,130,246,0)_100%),radial-gradient(72%_96%_at_52%_86%,rgba(125,211,252,0.44)_0%,rgba(125,211,252,0)_100%),linear-gradient(148deg,#eff6ff_0%,#dbeafe_50%,#e0f2fe_100%)] border border-solid border-[rgba(59,130,246,0.26)] shadow-[0_0_0_1px_rgba(96,165,250,0.14),0_14px_34px_-18px_rgba(37,99,235,0.58),0_0_42px_rgba(56,189,248,0.24)]
CSS3
.radial-glow-cobalt-beam {

  background-image:
    radial-gradient(45% 62% at 16% 18%, rgba(96, 165, 250, 0.66) 0%, rgba(96, 165, 250, 0) 100%),
    radial-gradient(50% 68% at 82% 14%, rgba(59, 130, 246, 0.58) 0%, rgba(59, 130, 246, 0) 100%),
    radial-gradient(72% 96% at 52% 86%, rgba(125, 211, 252, 0.44) 0%, rgba(125, 211, 252, 0) 100%),
    linear-gradient(148deg, #eff6ff 0%, #dbeafe 50%, #e0f2fe 100%);
  border: 1px solid rgba(59, 130, 246, 0.26);
  box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.14), 0 14px 34px -18px rgba(37, 99, 235, 0.58), 0 0 42px rgba(56, 189, 248, 0.24);
}