Glizzy UI

Glizzy UI Logo

A shadcn/ui-inspired UI library for Gleam and Lustre

What is Glizzy UI?

Glizzy UI is a comprehensive UI component library built for Gleam and Lustre. Inspired by shadcn/ui, it provides beautifully designed, accessible, and customizable components for building modern web applications.

Features

60+ Components - Buttons, inputs, dialogs, navigation, layout, and more
Accessible - WAI-ARIA compliant with keyboard navigation
Customizable - Easy to theme and style
Type-Safe - Full Gleam type safety
Zero Dependencies - Built on Lustre 5.x

Quick Start

Installation

gleam add glizzy

Usage

import glizzy/ui/button
import lustre.{type Msg, element}
import lustre/element.{button, text}

fn view(msg: Msg) -> element(Msg) {
  button.button(
    ~{
      variant: button.Primary,
      size: button.Default,
      disabled: False,
      onclick: Some(Clicked),
    },
    [text("Click me!")],
  )
}

Components

Category	Components
Core	Button, Checkbox, Input, Radio, Select, Slider, Switch
Forms	Calendar, Date Field, Date Picker, Number Field, Search Field, Text Field, Time Field
Layout	Box, Cluster, Stack, Sequence, Centre, Aside, Divider, Separator
Navigation	Breadcrumbs, Link, Menu, Tabs, Toolbar
Overlay	Dialog, Modal, Popover, Tooltip, Disclosure
Data Display	Avatar, Badge, Chip, KBD, Table, Tree
Feedback	Alert, Meter, Progress Bar, Skeleton, Spinner, Toast
Selection	Autocomplete, Checkbox Group, Combobox, Grid List, List Box, Radio Group, Tag Group, Toggle Button
Color	Color Area, Color Field, Color Picker, Color Slider, Color Swatch, Color Wheel
Advanced	Drop Zone, File Trigger, Virtualizer, Split Panel

Documentation

Examples

Check out the example application for a complete demo of all components.

cd examples/lustre_app
gleam run

Development

Build

gleam build

Test

gleam test

Format

gleam format

E2E Tests

bun install
bunx playwright test

License

MIT License - see LICENSE for details.

Acknowledgments

shadcn/ui - Design inspiration
Lustre - The Elm-inspired FRP library for Gleam
Gleam - The friendly language for robust type systems