Koala UI

Components

Every Koala UI component, grouped by category with a live preview. Pick one to see its variants, API, and copy-paste source.

Marketing

15
Update availableKoala UI v12 is here!
AnnouncementPro2 variants
Koala UI is on mobile
BannerPro10 variants
Product Designer
Austin, TXFull-time
Job CardPro2 variants

Pro

Popular
$29/mo
  • Unlimited projects
  • Priority support
PricingPro3 variants

Built to compose

One lede, every section opens with it.

Section HeaderPro3 variants

Lucía Ferrer

Co-founder & CEO

Team MemberPro1 variant
We replaced our in-house kit in a weekend.
AR
Alex Rivera
Founder, Lumen
TestimonialsPro6 variants

Store templates

Layouts built to sell.

Quick checkout

A cart that converts.

Your own theme

Four themes built in.

BentoPro5 variants

Getting started

FAQsPro2 variants
FooterPro2 variants
Landing page concept on a laptop
Code-forward product homepage
Minimal hero layout workspace
Bright marketing homepage mockup
Product homepage on a laptop screen
Designer workspace with a homepage draft
GalleryPro1 variant
New

Ship faster with Koala UI

HeroPro1 variant
Koala UI
NavbarPro2 variants
Compare plans
Starter
$0/mo
Pro
$29/mo
Features
Projects5Unlimited
Priority supportNot includedIncluded
SSO & SAMLNot includedIncluded
Pricing ComparisonPro1 variant

The band and its gutter

Section owns the vertical rhythm; the container owns the width cap.

SectionPro1 variant

AI

19
Agent MonitorPro1 variant
Assistant
Ready to help
How can I help today?
AI PanelPro3 variants
ApprovalPro1 variant
ArtifactPro1 variant
  • brief.pdfPDF · 2.4 MB
  • pricing.csv62%
AttachmentsPro1 variant
ChangesPro1 variant
What changed this release?
K
Three key updates landed.
K
ChatPro2 variants
CheckpointPro1 variant

A good LCP is 2.5 seconds or less1, measured in the field2.

CitationPro1 variant
Context MeterPro1 variant
ImageGenerating
62%
GenerationPro1 variant

Rolling out pricing

Ships behind a flag, so no customer sees it yet.

  • Draft the announcement

  • Turn on pricing_v2

MarkdownPro1 variant
Model SelectorPro1 variant
Plan overview

Set up analytics

To-dos3
  1. Audit the tracking
    Done
  2. Add a consent banner
    In progress
  3. Verify in staging
    Not started
PlanPro1 variant
Prompt InputPro4 variants
QuestionPro1 variant
ResearchPro1 variant
The onboarding .
SuggestionsPro4 variants
ToolPro1 variant

Forms

8
Forgot password?
AuthenticationPro2 variants
87 / 500
ContactPro1 variant

Good

FeedbackPro1 variant

Subscribe to our newsletter

We care about your data. Read our privacy policy.

NewsletterPro2 variants
PaymentPro1 variant
JC
koalaui.com/
SettingsPro1 variant

Question 1

What brings you here?

SurveyPro1 variant
Early access

Join the waitlist

KJMS

1,200+ already joined

WaitlistPro1 variant

Data Display

15

Ship faster

Animated Label1 variant
1,429Deploys this month
Animated NumberPro1 variant

Top pages

Views

  • /21,380
  • /docs/get-started12,940
  • /pricing8,420
  • /blog/tokens5,110
Bar ListPro1 variant
monthRevenue
Jan4,200
Feb3,800
Mar5,100
Apr6,200
ChartPro1 variant
NameStatusSeats
Alice ChenActive12
Bob LeePending4
Carla RuizActive28
Data TablePro2 variants
Plan
Pro Annual
Seats
12 of 20
Renews
Mar 1, 2026
Description ListPro2 variants
HeatmapPro2 variants
On-Screen KeyboardPro1 variant
  • 2
    Sneakers
    Size 10 · Red
    $128.00
Subtotal
$128.00
Shipping
Free
Total
$128.00
Order SummaryPro1 variant

Citation

City of Bayview

Plate
8KTR204
State
CA
Fine
$63.00
Violation
Expired meter
Issued
10/04 14:52
No. 448120Pay within 21 days
PaperPro1 variant
  • Move: 70%
  • Exercise: 80%
  • Stand: 75%
  • Move70%
  • Exercise80%
  • Stand75%
Radial MeterPro1 variant
Top products
  1. 1
    Trail Runner
    1284
  2. 2
    Merino Tee
    968
  3. 3
    Field Watch
    742
RankingPro3 variants

Police Report

Breath alcohol test

Subject: Daniel Ortega
Officer: Sgt. R. Okafor

Result

0.32

ReceiptPro1 variant
Total orders
1,429
12.4%
vs last month
StatPro3 variants
REST API99.93%
Webhooks99.97%
  • Operational
  • Degraded
  • Partial outage
  • Major outage
TrackerPro1 variant

Base

106

A production-ready React design system.

Accordion3 variants
  1. Sarah commented
  2. Marcus approved
  3. Priya uploaded
Activity FeedPro1 variant
Alert5 variants
EAMJALRT
Avatar6 variants
EAMJALRT+2
Avatar Group5 variants
Online Betav2.4.0 main
Badge12 variants
ReactTypeScriptTailwind+2
Badge GroupPro1 variant
Breadcrumb1 variant
Button6 variants
Button Group1 variant
Upgrade to Pro
Unlock every theme and component.
Owned source, no lock-in.
Card3 variants
Slide 1
Slide 2
CarouselPro4 variants

TAC-2

4 online
Elena Vásquez1-LINCOLN-4
Anyone near Mirror Park?
Alex Moreno
Copy, en route.
Channel ChatPro1 variant
Checkbox2 variants

Get started

1 of 3 complete33%
  • Invite your team
    Completed
  • Connect a repository
    In progress
  • Set up billing
    Not started
ChecklistPro3 variants

Call #2291 · 2 assigned

MEDIC-4
ChipPro1 variant
install.shBash
npx koala add button
Code Snippet1 variant
Collapsible3 variants
Color PickerPro2 variants
Combobox3 variants
CommandPro1 variant
Compare SliderPro1 variant
Context Menu1 variant
Cookie ConsentPro3 variants
Dialog4 variants
Divider4 variants
DockPro2 variants

Syncing records

Dot MatrixPro1 variant
1-ADAM-12Available
4-LINCOLN-7En route
2-KING-31On scene
9-MARY-4Off duty
DotPro1 variant
Drawer4 variants
Dropdown Menu1 variant
Smileys & Emotion
People & Body
Animals & Nature
Emoji PickerPro1 variant
No projects yet
Empty StatePro6 variants
Event CalendarPro1 variant
Expandable SearchPro3 variants

We only use this for receipts.

Field1 variant
annual-report.pdf
1.2 MB
File CardPro4 variants
File PreviewPro3 variants
Drop your files, or click here
File UploadPro1 variant
Floating WindowPro1 variant

Profile

FormPro1 variant
Resultmg/L
0.48
Pass
Warn
Fail
Handheld DevicePro1 variant
Histogram SliderPro1 variant

Delete Atlas?

The project and its 128 files go with it.

Hold ButtonPro1 variant
Hover Card1 variant
Ink TrayPro1 variant
Input2 variants
https://
.com
Input Group3 variants
IslandPro2 variants
KEsc⏎ Enter
Kbd4 variants
3 of 4
KeypadPro1 variant
Label1 variant

Start with the installation guide, then browse every component.

Link1 variant
LightboxPro1 variant
  • Account
    Profile, email, password
  • Billing
    Plan, invoices, payment
ListPro2 variants
  • v2.4.1
    Sep 24
  • v2.4.0
    Sep 18
  • v2.3.2
    Sep 03
  • v2.3.1
    Aug 27
  • v2.3.0
    Aug 20
Load MorePro1 variant
FlatironSoHo
MapPro1 variant
Menubar2 variants
MeterPro1 variant
Multi SelectPro1 variant

Used for your reports.

Native Select1 variant
Navigation MenuPro1 variant
Number Field2 variants
Notebook PagePro1 variant
OTP InputPro3 variants
Pagination1 variant

Strong

Password StrengthPro1 variant
Popover1 variant
Progress2 variants
Promo CardPro4 variants

Koala UI v12

A major update focused on consistency and a responsive library.

  • Unified control heights
  • Clearer tab states
Prose1 variant
Push to TalkPro1 variant
QR code
QR CodePro1 variant
Radio Group2 variants
RatingPro2 variants
Files
Editor
ResizablePro2 variants
BIU

Release notes

A rich editor with inline formatting.

Rich Text EditorPro1 variant
Scroll Area1 variant
Select1 variant
Sheet1 variant
SidebarPro2 variants
SignaturePro1 variant
Signature PadPro1 variant
Skeleton3 variants
Slider5 variants
Spinner1 variant
  1. 21:41:52UNIT 12EN ROUTE
  2. 21:41:58UNIT 07ON SCENE
  3. 21:42:03DISPATCHCALL 4471
Unit 12
21:42:07
Status BarPro1 variant
Stepper2 variants

Label colorBlue

Swatch GridPro1 variant
Switch1 variant

Q4 roadmap

12 initiatives, 3 teams.

Tab StripPro1 variant
Table of ContentsPro6 variants
Tablet FramePro1 variant
Tabs3 variants
koala
koala λ add dialog
Resolving button, dialog
Wrote 2 components
Done in 1.2s
koala λ
TerminalPro1 variant
Textarea3 variants
Toast5 variants
Toggle2 variants
Toggle Group2 variants
ToolbarPro3 variants
Tooltip2 variants
  • src
    • button.tsx
    • card.tsx
  • globals.css
TreePro1 variant
1:24 / 3:48
Video PlayerPro1 variant
TAC-2 401.5
  • L
    Liam DixonOfficer
    Talking
  • E
    Evelyn MolinaSergeant
  • M
    Marcus ReyesDetective
Voice RosterPro1 variant
November 2026, December 2026
November 2026
December 2026
Date PickerPro3 variants
Dashboard
LayoutPro2 variants