Joko UI

Joko UI is a collection of free Tailwind CSS components that can be used in your next project. With a range of copy-paste ready components, you can build your next marketing website, admin dashboard, eCommerce store and much more without installing any heavy dependencies.

📚 View Documentation

Table of Contents

• Getting Started
• Usage
• Components
  • 📱 Application
  • 📣 Marketing
• Roadmap
• Contributing
• License

Getting Started

There is no Joko UI installation. If you have a Tailwind CSS project, you can simply copy the code and paste it into your project.

It is designed to be:

• No Config: Works with standard Tailwind setup.
• No Install: No npm packages to manage.
• No Setup: Just copy, paste, and customize.

Usage

Browse the website for the components you need, copy the code and paste it into your project.

1. Browse the website for a component you like.
2. Preview the component at different breakpoints (Mobile, Tablet, Desktop).
3. Toggle Dark Mode to see how it looks in dark themes.
4. Click on the 'Code' tab or the 'Copy Code' button to get the source.
5. Paste the copied code into your project.

[!NOTE] All components support both Light and Dark modes out of the box using Tailwind's dark: modifier.

Components

Joko UI has a growing collection of freely available components:

📱 Application

UI components for building functional web applications:

• [x] Accordions
• [x] Alerts
• [x] Avatars
• [x] Badges
• [x] Breadcrumbs
• [x] Buttons
• [x] Cards
• [x] Carousels
• [x] Checkboxes
• [x] Date Pickers
• [x] Drawers
• [x] Dropdowns
• [x] Forms
• [x] Inputs
• [x] Loaders
• [x] Modals
• [x] Navbars
• [x] Paginations
• [x] Progress
• [x] Radios
• [x] Selects
• [x] Sidebars
• [x] Skeletons
• [x] Tables
• [x] Tabs
• [x] Toasts
• [x] Toggles
• [x] Tooltips

📣 Marketing

Components for building high-converting landing pages:

• [x] Author Cards
• [x] Banners
• [x] Blog Cards
• [x] Brand Lists
• [x] CTAs
• [x] Description Lists
• [x] Error Pages
• [x] FAQ
• [x] Feature Sections
• [x] Footers
• [x] Headers
• [x] Heroes
• [x] Newsletter
• [x] Pricing
• [x] Stats
• [x] Steppers
• [x] Teams
• [x] Testimonials

Roadmap

We are actively developing new components. Here is our prioritized list of upcoming additions. If you'd like to contribute, feel free to pick any unchecked item and submit a PR!

📱 Application UI

• [ ] Textareas
• [ ] Sliders (input)
• [ ] File Uploads
• [ ] Dividers
• [ ] Containers
• [ ] Grid (Stack)
• [ ] Headings
• [ ] Labels
• [ ] Captions (helper text)
• [ ] Code (inline code)
• [ ] Error States
• [ ] Empty States
• [ ] Data Grid
• [ ] Lists
• [ ] Timelines
• [ ] Tree View

📣 Marketing UI

• [ ] Ratings (Review)
• [ ] Lead Forms
• [ ] Mega Menus

Contributing

You can contribute by adding new components, fixing bugs or improving the documentation. Please read CONTRIBUTING.md before opening an issue or Pull Request.

License

Joko UI is an open source project licensed under the MIT license.