v0.1.0 · 40 components
Primitives14
⬛
ForgeButton
▭
ForgeCard
▱
ForgeInput
◉
ForgeBadge
⬭
ForgeToggle
▾
ForgeSelect
☑
ForgeCheckbox
◎
ForgeRadio
⊣
ForgeSlider
▤
ForgeTextarea
◎
ForgeAvatar
▣
ForgeStatCard
⊕
ForgeTagInput
◫
ForgeDatePicker
Motion5
⟳
ForgeSpinner
↑
ForgeFadeUp
⇄
ForgeTicker
◐
ForgeMorphBlob
⓪
ForgeCountUp
Charts5
▦
ForgeBarChart
╱
ForgeLineChart
◯
ForgeDonut
▬
ForgeProgress
╱
ForgeSparkline
Navigation6
⌘
ForgeCommand
▬
ForgeNavbar
›
ForgeBreadcrumb
⊡
ForgePagination
◧
ForgeSideNav
⊟
ForgeTabs
Overlay5
◨
ForgeModal
◫
ForgeToast
◳
ForgeTooltip
▾
ForgeDropdown
◁
ForgeDrawer
Feedback4
▒
ForgeSkeleton
⚠
ForgeAlert
⊕
ForgeStepper
☰
ForgeAccordion
Data1
⊞
ForgeTable
Preview
ForgeButton
Live
Hover · click · interact
Install command — updates as you customise
$
npx @forgelabs-studio/ui add button
→writes ForgeButton.tsx + ForgeButton.css → components/forge/import { ForgeButton } from '@/components/forge/ForgeButton'
PropertiesButton
Global tokens
Font family
Text colour
Radius scale
Content
Label
Icon
×
→
↗
↑
★
⚡
♥
◆
●
✦
Variant
glow
solid
ghost
outline
soft
spectrum
Colour
Size
Size preset
Font size
13px
Font weight
Border radius
8px
Padding X
20px
Padding Y
10px
Typography
Letter spacing
Uppercase
Interaction
Hover effect
lift
scale
glow
none
Click animation
ripple
scale
bounce
none
Shadow
glow
soft
hard
none
States
Full width
Disabled