Liquid Glass STUDIO / 2.2
For agents ↗
MATERIAL / TINTED

Rose: raspberry-pink glass with personality

A bold raspberry tint, generous corners and a warm inner glow. Rose brings emotion to the spots where neutral glass would feel too reserved.

About the material

Rose is built on raspberry pink #ff2d6f at about 0.54 opacity: the color owns the surface, yet you can still sense the scene behind it. Blur is 30 px, saturation 190%, and a 30 px radius keeps shapes soft. Its inner glow (0.32) is the strongest in the tinted group, and a #ffb8cf rim traces the edge in pale blush. The result is warm, slightly glossy pink glass rather than the flat neon you often get from quick glassmorphism recipes.

Pink reads as affection, play and personality. That makes Rose a good candidate for likes and favorites, dating and social apps, fashion, beauty and creative tools, and promo controls that need to pop. It is tuned for dark scenes and media, where raspberry glows hardest over photos and video. Skip it for long-form reading surfaces and avoid stacking glass inside glass. A selected tab on Rose gets a bright plate with deep raspberry text.

Accessibility ships with the preset. Reduce Transparency drops blur to 8 px, turns refraction off and pushes the tint nearly opaque; solid quality mixes the hue into an opaque base, so pink stays pink and text keeps 7:1 contrast or better. In the studio, pick one of 24 backdrops, try Rose on a button, switch or popover, and export HTML/CSS, Tailwind, SwiftUI or a JSON contract your agent can read.

Best for

  • Likes, favorites and reactions
  • Dating and social apps
  • Fashion, beauty and creative tools
  • Promo buttons over photos

Parameters

CategoryTinted
Variantregular
Blur30px
Saturation190%
Tint and opacity#ff2d6f, 54%
Rim: width and brightness1.5px, 70%
Refraction scale32

Where to use it

Best on: dark backgrounds, photos and video.
Avoid: long-form content, glass nested in glass.

Code

import { generateCode } from
  '/releases/2.2.0/sdk/core/index.js';

const result = generateCode({
  component: 'button', preset: 'rose'
});

The SDK runs without the DOM: swap in the component you need, the preset stays the same.

Presets JSON contract ↗