Glass Elements Pro

The glass building blocks: buttons, icon buttons, badges, avatars, controls, segments, tab items, fields, list items and progress.

Storybook Figma

Preview

Example

4 examples: Buttons, Badges and avatars, Controls and segments, Fields, list items and progress.

Install

Part of Pixels Pro. Add your licence key to .npmrc, then install.

BASH

npm i @pixelsds-pro/react @pixelsds/react react-aria-components

Usage

JSX

import { GlassElements } from '@pixelsds-pro/react';

export default function Example() {
  return <GlassElements />;
}

Every example above, with its props and full source, is in the Storybook. Built from Pixels tokens, so it follows your brand colour, dark mode and right-to-left.