3
Back

Gradient #51

glow-opaline-blush

radial-glow-opaline-blush

Copy styles

Tailwind
bg-[radial-gradient(52%_62%_at_14%_16%,color-mix(in_oklch,oklch(86%_0.09_20)_80%,transparent)_0%,transparent_100%),radial-gradient(54%_66%_at_86%_14%,color-mix(in_oklch,oklch(83%_0.11_335)_76%,transparent)_0%,transparent_100%),radial-gradient(78%_96%_at_52%_88%,color-mix(in_oklch,oklch(89%_0.07_80)_70%,transparent)_0%,transparent_100%),linear-gradient(145deg,oklch(98%_0.01_20)_0%,oklch(93%_0.05_18)_34%,color-mix(in_oklch,oklch(90%_0.08_340)_75%,oklch(95%_0.04_80))_70%,oklch(96%_0.03_30)_100%)] border border-solid border-[color-mix(in_oklch,oklch(74%_0.09_340)_24%,white)] shadow-[0_0_0_1px_color-mix(in_oklch,oklch(84%_0.07_330)_18%,transparent),0_18px_38px_-22px_color-mix(in_oklch,oklch(66%_0.11_8)_45%,transparent)]
CSS3
.radial-glow-opaline-blush {

  background-image:
    radial-gradient(52% 62% at 14% 16%, color-mix(in oklch, oklch(86% 0.09 20) 80%, transparent) 0%, transparent 100%),
    radial-gradient(54% 66% at 86% 14%, color-mix(in oklch, oklch(83% 0.11 335) 76%, transparent) 0%, transparent 100%),
    radial-gradient(78% 96% at 52% 88%, color-mix(in oklch, oklch(89% 0.07 80) 70%, transparent) 0%, transparent 100%),
    linear-gradient(145deg,
      oklch(98% 0.01 20) 0%,
      oklch(93% 0.05 18) 34%,
      color-mix(in oklch, oklch(90% 0.08 340) 75%, oklch(95% 0.04 80)) 70%,
      oklch(96% 0.03 30) 100%);
  border: 1px solid color-mix(in oklch, oklch(74% 0.09 340) 24%, white);
  box-shadow: 0 0 0 1px color-mix(in oklch, oklch(84% 0.07 330) 18%, transparent), 0 18px 38px -22px color-mix(in oklch, oklch(66% 0.11 8) 45%, transparent);
}