glasscn
Glass Checkbox

A boolean control with the shared glass variant system.

Adds the frosted treatment to nested panels and interactive controls for a denser glassmorphism look.

import { GlassCheckbox } from "@/components/ui/glasscn/glass-checkbox"

export function CheckboxDemo() {
  return <GlassCheckbox glassVariant="liquid-bold" />

Installation

$ npx shadcn add @glasscn/glass-checkbox

API

Prop
Type
Default
Description
GlassCheckboxglassVariant
"clear" | "frosted" | "subtle" | "liquid" | "liquid-bold""clear"
Controls the glass surface treatment.
GlassCheckbox...props
React.ComponentProps<typeof Checkbox>-
Props from the underlying shadcn/ui primitive.

Variants

clear

Adds the frosted treatment to nested panels and interactive controls for a denser glassmorphism look.

frosted

Adds the frosted treatment to nested panels and interactive controls for a denser glassmorphism look.

subtle

Adds the frosted treatment to nested panels and interactive controls for a denser glassmorphism look.

liquid

Adds the frosted treatment to nested panels and interactive controls for a denser glassmorphism look.

liquid-bold

Adds the frosted treatment to nested panels and interactive controls for a denser glassmorphism look.