Gummy Styling Guide
Beautiful gummy UI components with gorgeous themes
Theme System
Theme Controls
Background
Color Scheme
Font
Text Styles
This is regular body text in the beautiful monospace font family.
This is muted text for secondary information.
This is accent text that matches your current theme.
Heading Hierarchy
Heading 1
Heading 2
Heading 3
Heading 4
Code Display
const beautiful = "gummy ui";import { ThemeProvider } from "./theme";<button className="gummy-button-accent">background: var(--accent-primary);Input Components
Standard Inputs
Beautiful Input
Strong Accent Panel
This combines strong styling with accent colors.
Extra content for balanced visual weight.
Strong Panel
This panel has a stronger background for emphasis.
Accent Panel
This panel features the current accent color.
Additional content to match the larger input section height.
Standard Panel
This is a beautiful gummy panel with soft shadows.