Ori ToolsOribox
← All tools

Color and design

Glassmorphism CSS Generator

Use Glassmorphism CSS Generator online for free. Set Base color, Opacity (%), Backdrop blur (px) and run it in your browser. No sign-up required.

Input

Result

How to use

  1. Open Glassmorphism CSS Generator and review the inputs below.
  2. Enter your values and check the units shown beside each field.
  3. Adjust the options, then press Run or Calculate. Interactive tools show their own start controls in the result area.
  4. Review the result. Use the copy or download control when it is available.

Inputs and starting values

InputStarting value / exampleAvailable options
Base color
#397d68
Opacity (%)
25
Backdrop blur (px)
12

Things to check

The starting values are examples, not recommendations. Check the units and replace them with your own values.

Frequently asked questions

Are my inputs and files uploaded?

The tool processes inputs in your browser without uploading them. Browser storage, microphone or sensor permissions are described by the tool when applicable.

Related tools

See all 378 tools