Collection

Tailwind UI Kits & Templates

Flexible Tailwind UI kits and templates made for real product interfaces, from crisp marketing sections to complete application screens. They give build teams a strong visual system they can customize quickly and carry cleanly into production.

137 designs
Made by the HorizonX team

New

Cost Meter

Track token usage, credits and session spend against a budget, with per-model detail.

HorizonX Code

New

Filter Bar

Find accounts with search, removable conditions and saved views.

HorizonX Code

New

Funnel Chart

Find conversion and drop-off between activation stages.

HorizonX Code

New

Grouped Rows

Organize table rows under collapsible headers with counts and annual value totals.

HorizonX Code

New

Kanban Board

Columns of task cards with counts and work-in-progress limits; drag cards between columns or move them by keyboard, and add a card inline.

HorizonX Code

New

Live Log

Follow structured logs, filter levels, highlight search matches, pause scrolling and copy the full buffer.

HorizonX Code

New

Order Confirmation

A clear receipt with order number, delivery estimate, items and next steps.

HorizonX Code

New

Order Summary

Itemized prices, coupon feedback, estimated tax, delivery and one consistent total.

HorizonX Code

New

Permission Primers

Screens that explain notifications and tracking before the phone's own prompt, each with a real "Not now".

HorizonX Code

New

Upsell Modal

An optional order extra with explicit add and decline actions in a focus-trapped dialog.

HorizonX Code

Animated Empty State

An empty state that floats in with a staggered title, message and action after the last item is removed.

HorizonX Code

Animated Hover Card

A profile preview card that opens when you rest on a link, with a short delay so it never flickers.

HorizonX Code

Animated Validation Shake

A field that gives a short horizontal shake on an invalid submit while the error message fades in.

HorizonX Code

New

Approval Gate

Review a command and its risk before allowing it once, allowing this command for the session, or denying it.

HorizonX Code

New

Assignee Picker

Pick several people for a task from a searchable list with avatars; remove one with its chip or everyone at once.

HorizonX Code

New

Checkout Steps

Contact, shipping and payment stages with validation, edit actions and a mobile order disclosure.

HorizonX Code

New

Conversation Sidebar

Chat history grouped by date, with search, rename in place and delete with a confirmation. Becomes a sheet on phones.

HorizonX Code

New

Donut Chart

Understand the composition of visitor sources.

HorizonX Code

New

Invoice Table

Paginated invoices with downloadable CSV receipts and an empty state.

HorizonX Code

New

Notification Preferences

A matrix of events by channel (email, push, in-app) with switches, quiet hours and a reset to the defaults.

HorizonX Code

New

Result Cards

A tool's output shown as a readable card: a 5-row data table, a two-week line chart or a weather report, each with a View raw toggle.

HorizonX Code

Animated Swipe Delete

An inbox row that reveals a delete action as you swipe it, then collapses, with a visible delete button and undo.

HorizonX Code

Animated Toggle Switch

A switch whose thumb slides across with a slight squash while the track fills.

HorizonX Code

New

Board Filters

A filter bar for task views: search, assignee avatars, a label menu and Only my tasks, with a live result count.

HorizonX Code

New

Developer Keys

Create, list and revoke API keys: name, scope and expiry, the secret shown once with copy, last-used dates.

HorizonX Code

New

Inline Cell Edit

Edit text, select and date values in place with keyboard save and cancel.

HorizonX Code

New

Task Detail Panel

Everything about one task in a side sheet: title, status, priority, assignees, labels, dates, description, checklist and comments.

HorizonX Code

New

Task List View

The board's tasks as a dense list grouped by status, with collapsible groups and status changed in place from each row.

HorizonX Code

New

Task Queue

Prioritize queued work by dragging, keyboard pickup or move buttons, and pause or resume the queue.

HorizonX Code

New

Tool Chips

Toggles for the tools an agent may use (search, code, files, browser) with tooltips, a count of active tools and why a tool is off.

HorizonX Code

New

Upgrade Modal

Compare plans and billing periods, then review before confirming.

HorizonX Code

New

Usage Meters

Included capacity, exact consumption and visible threshold alerts.

HorizonX Code

New

Credits Top-up

Credit purchases with preset or custom amounts and automatic top-up settings.

HorizonX Code

New

Tool Error Card

A failed tool call in plain words: the error code, a collapsible stack, Retry and Edit arguments with JSON validation.

HorizonX Code

Animated Alert Dialog

A blocking confirmation dialog for destructive actions, with the safe Cancel choice focused first.

HorizonX Code

New

Bulk Actions

Assign, export or delete selected accounts, with explicit all-results selection.

HorizonX Code

New

Members and Invites

Manage a team: seat counter, invite by email with a role, member table with role changes, pending invites with resend and revoke.

HorizonX Code

New

Payment Method

A drawn card and editable billing details with a default-method switch.

HorizonX Code

New

Profile Form

Edit a profile: photo with preview, name, username with a live availability check and a bio with a counter.

HorizonX Code

Coperto Activity Skyline

A 3D calendar heatmap for restaurants: a year of covers per night as a calendar that rises into an isometric skyline.

HorizonX Code

Helio Activity Skyline

A 3D calendar heatmap for solar yield: a year of daily kWh as a calendar that rises into an isometric skyline.

HorizonX Code

From the blog

Guides

All articles

Guide Best React + Tailwind Component Libraries in 2026 Read the guide Guide What Are Coded UI Kits? (And When They Beat Figma Kits) Read the guide Guide Tailwind Accordion: Accessible Copy-Paste Code (2026) Read the guide Guide Premium UI Kits vs Free Alternatives: A Designer's ROI Analysis Read the guide

Keep exploring

Related collections

All collections

Find the next design for your project

Browse every design in the HorizonX catalog, from UI kits and templates to textures, shaders and mockups.

Explore all designs Browse collections

Cost Meter

Filter Bar

Funnel Chart

Grouped Rows

Kanban Board

Live Log

Order Confirmation

Order Summary

Permission Primers

Upsell Modal

Animated Empty State

Animated Hover Card

Animated Validation Shake

Approval Gate

Assignee Picker

Checkout Steps

Conversation Sidebar

Donut Chart

Invoice Table

Notification Preferences

Result Cards

Animated Swipe Delete

Animated Toggle Switch

Board Filters

Developer Keys

Inline Cell Edit

Task Detail Panel

Task List View

Task Queue

Tool Chips

Upgrade Modal

Usage Meters

Credits Top-up

Tool Error Card

Animated Alert Dialog

Bulk Actions

Members and Invites

Payment Method

Profile Form

Coperto Activity Skyline

Helio Activity Skyline

Guides

Related collections

React Components & Next.js Templates

Dashboard Templates & Admin UI

Landing Page Templates

CSS Cards & Animated Card Components

CSS Buttons & Animated Button Effects

Find the next design for your project