Skip to main content

Free css tool

Glassmorphism & Neumorphism Generator

Create the frosted-glass look (glassmorphism) or soft, extruded UI (neumorphism) with live preview. Adjust blur, transparency, border, corner radius and shadow intensity, then copy ready-to-use CSS.

Free · No sign-up · Runs in your browser

Features

  • Glassmorphism and neumorphism modes
  • Live preview
  • Flat and pressed (inset) styles
  • Copy-paste CSS

How to use the Glassmorphism & Neumorphism Generator

  1. Choose Glassmorphism or Neumorphism.
  2. Adjust the sliders and colors.
  3. Copy the generated CSS into your project.

Frequently asked questions

Does glassmorphism work in all browsers?

It uses backdrop-filter, supported by all modern browsers including Chrome, Edge, Safari and Firefox.

Is neumorphism accessible?

Keep enough contrast for text and buttons; soft shadows alone can be hard to see for some users.

More free tools

CSS Mesh Gradient Generator Create smooth mesh gradients with color harmony rules and presets (Sunset, Ocean, Aurora…). Copy pure CSS – no images needed. CSS Box Shadow Generator Visually create CSS box-shadow effects with offset, blur, spread, color and inset options, then copy the code. CSS Border Radius Generator Set each corner radius visually and copy the CSS border-radius code. Free online rounded-corner generator. Free QR Code Generator Create free QR codes for links, text, email, SMS, WiFi, vCard and WhatsApp. Pick colors and size, then download PNG or SVG. No sign-up, no expiry. CMYK Color Separation Split any JPG or PNG into Cyan, Magenta, Yellow and Black (Key) plates for offset and screen printing. Free online CMYK separation, runs in your browser. Color Palette Generator Generate beautiful random color palettes for your designs. Copy HEX codes in one click. Free online color scheme generator for designers.

See all free tools →

Free Tools