Gloss UIv4.4
    • Introduction
    • Architecture
    • Component Patterns
    • Best Practices
    • Glossary
    • Design Philosophy
    • Colors
    • Typography
    • Shadows
    • Spacing
    • Pattern Library
      • Text
      • Number
      • Textarea
      • Select
      • Checkbox
      • Radio
      • Toggle
      • Cards
      • Chips
      • Badges
      • Tags
      • Tooltip
      • Accordion
      • Menu
      • Buttons
      • Drop Downs
      • Checkbox & Toggle
      • Links
      • Form & Validation
      • Async/Loading
      • DatePicker
      • DateRangePicker
      • TimePicker
      • ColorPicker
      • FileUpload
      • MaskedInput
      • RangeSlider
      • Rating
      • MetricCard
      • BreakdownTable
      • Skeleton
      • MetricCardGrid
      • TabbedDataView
      • ChartControlBar
      • TimeFrame
      • FilterChip
      • TabGroup
      • ContextMenu
    • MetricCard Composites
    • Login Form
    • Address Group
    • Credit Card Form
    • Destructive Modal
    • Overview
    • Strategy
    • Component Audit
    • Exports

Prototypes

Pattern Library

Pre-configured component compositions for common use cases. Each pattern includes validation schemas, accessibility features, and customizable props.

4 patterns

Forms3

Login Form

A standard authentication form with email, password, remember me checkbox, and forgot password link.

authenticationformlogin+2

Address Group

A complete address collection form with street, city, state, and ZIP fields. Includes US state select and ZIP code validation.

addressformshipping+3

Credit Card Form

A secure payment form with card number masking, expiry date formatting, CVV input, and Luhn validation.

paymentformcredit-card+3

Feedback1

Destructive Modal

A confirmation dialog for dangerous actions like delete operations. Supports optional text confirmation for extra safety.

modaldialogconfirmation+3