Skip to content

Instantly share code, notes, and snippets.

@arfinmilondev
Created January 29, 2026 05:53
Show Gist options
  • Select an option

  • Save arfinmilondev/f87d09864c8f0ecf8ae590eeedc13c71 to your computer and use it in GitHub Desktop.

Select an option

Save arfinmilondev/f87d09864c8f0ecf8ae590eeedc13c71 to your computer and use it in GitHub Desktop.
left right blurry overlay background effect
.blur-banner.overlay_background:after, .blur-banner.overlay_background:before {
content: '';
position: absolute;
top: 0;
height: 100%;
width: 15%;
z-index: 2;
}
.blur-banner.overlay_background:before {
left: 0;
background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,0) 85.38%);
}
.blur-banner.overlay_background:after {
right: 0;
background: linear-gradient(-90deg, #fff 0%, rgba(255,255,255,0) 85.38%);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment