Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/markmead/hyperui

Free Tailwind CSS components for application UI, ecommerce and marketing with support for dark mode, RTL and Alpine JS 🚀
https://github.com/markmead/hyperui

hacktoberfest tailwindcss tailwindcss-components tailwindcss-components-library tailwindcss-template tailwindcss-ui

Last synced: 4 days ago
JSON representation

Free Tailwind CSS components for application UI, ecommerce and marketing with support for dark mode, RTL and Alpine JS 🚀

Host: GitHub
URL: https://github.com/markmead/hyperui
Owner: markmead
License: mit
Created: 2021-11-12T17:14:11.000Z (about 3 years ago)
Default Branch: main
Last Pushed: 2024-10-29T09:22:28.000Z (about 2 months ago)
Last Synced: 2024-10-29T10:56:31.897Z (about 1 month ago)
Topics: hacktoberfest, tailwindcss, tailwindcss-components, tailwindcss-components-library, tailwindcss-template, tailwindcss-ui
Language: HTML
Homepage: https://hyperui.dev
Size: 38.8 MB
Stars: 9,895
Watchers: 54
Forks: 390
Open Issues: 1
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

stars - markmead/hyperui - Free Tailwind CSS components for application UI, ecommerce and marketing with support for dark mode, RTL and Alpine JS 🚀 (HTML)
StarryDivineSky - markmead/hyperui

README

        # 🚀 HyperUI

HyperUI is a collection of free Tailwind CSS components that can be used in your next project. With a range of components, you can build your next marketing website, admin dashboard, eCommerce store and much more.

![](https://hyperui.dev/og.jpg)

## Table of Contents

- [Getting Started](#getting-started)

- [Usage](#usage)

- [Components](#components)

  - [🤖 Application UI](#application-ui-)

  - [📣 Marketing](#marketing-)

- [Contributing](#contributing)

- [License](#license)

## Getting Started

There is no HyperUI installation, if you have a Tailwind CSS project, you can copy the code and paste it into your project. Some components do use Alpine JS.

## Usage

Browse the website for the components you need, copy the code and paste it into your project. Some components will have support for dark mode and Alpine JS variants.

1. Browse the website for a component you like.

2. Preview the component at different breakpoints and check its compatibility with:

- LTR

- Dark mode

- Interactivity with Alpine JS

3. Click on the 'Copy' button to copy the source code.

4. Paste the copied code into your project.

## Components

HyperUI has a wide range of freely available components. These components include:

### Application UI 🤖

- [Alerts](https://www.hyperui.dev/components/application-ui/alerts)

- [Auth Forms](https://www.hyperui.dev/components/application-ui/login-forms)

- [Badges](https://www.hyperui.dev/components/application-ui/badges)

- [Breadcrumbs](https://www.hyperui.dev/components/application-ui/breadcrumbs)

- [Button Groups](https://www.hyperui.dev/components/application-ui/button-groups)

- [Checkboxes](https://www.hyperui.dev/components/application-ui/checkboxes)

- [Details Lists](https://www.hyperui.dev/components/application-ui/details-list)

- [Dividers](https://www.hyperui.dev/components/application-ui/dividers)

- [Dropdowns](https://www.hyperui.dev/components/application-ui/dropdown)

- [Error Pages](https://www.hyperui.dev/components/application-ui/error-pages)

- [Filters](https://www.hyperui.dev/components/application-ui/filters)

- [Grids](https://www.hyperui.dev/components/application-ui/grids)

- [Header](https://www.hyperui.dev/components/application-ui/headers)

- [Inputs](https://www.hyperui.dev/components/application-ui/inputs)

- [Media](https://www.hyperui.dev/components/application-ui/media)

- [Pagination](https://www.hyperui.dev/components/application-ui/pagination)

- [Progress](https://www.hyperui.dev/components/application-ui/progress)

- [Quantity Inputs](https://www.hyperui.dev/components/application-ui/quantity-inputs)

- [Radio Groups](https://www.hyperui.dev/components/application-ui/radio-groups)

- [Selects](https://www.hyperui.dev/components/application-ui/selects)

- [Side Menu](https://www.hyperui.dev/components/application-ui/side-menu)

- [Stats](https://www.hyperui.dev/components/application-ui/stats)

- [Steps](https://www.hyperui.dev/components/application-ui/steps)

- [Tables](https://www.hyperui.dev/components/application-ui/tables)

- [Tabs](https://www.hyperui.dev/components/application-ui/tabs)

- [Textareas](https://www.hyperui.dev/components/application-ui/textareas)

- [Toggles](https://www.hyperui.dev/components/application-ui/toggles)

- [Vertical Menu](https://www.hyperui.dev/components/application-ui/vertical-menu)

### Marketing 📣

- [Announcements](https://www.hyperui.dev/components/marketing/announcements)

- [Banners](https://www.hyperui.dev/components/marketing/banners)

- [Blog Cards](https://www.hyperui.dev/components/marketing/blog-cards)

- [Buttons](https://www.hyperui.dev/components/marketing/buttons)

- [Cards](https://www.hyperui.dev/components/marketing/cards)

- [Carts](https://www.hyperui.dev/components/marketing/carts)

- [CTAs](https://www.hyperui.dev/components/marketing/ctas)

- [FAQs](https://www.hyperui.dev/components/marketing/faqs)

- [Footers](https://www.hyperui.dev/components/marketing/footers)

- [Forms](https://www.hyperui.dev/components/marketing/forms)

- [Header](https://www.hyperui.dev/components/marketing/headers)

- [Popups](https://www.hyperui.dev/components/marketing/popups)

- [Pricing](https://www.hyperui.dev/components/marketing/pricings)

- [Product Cards](https://www.hyperui.dev/components/marketing/product-cards)

- [Product Collections](https://www.hyperui.dev/components/marketing/product-collections)

- [Sections](https://www.hyperui.dev/components/marketing/sections)

- [Stats](https://www.hyperui.dev/components/marketing/stats)

- [Testimonials](https://www.hyperui.dev/components/marketing/testimonials)

## Contributing

You can contribute by adding new components, fixing bugs or improving the documentation. Please create an issue before starting any work. Once you get approval on your issue, you can create a new branch and submit your changes in a PR. Please note that all PRs need to be reviewed.

A [detailed contributing guide](https://www.hyperui.dev/blog/how-to-contribute) on how to contribute including examples of adding new components is available on the HyperUI [blog](https://www.hyperui.dev/blog).

## License

HyperUI is an open source project licensed under the [MIT license](https://github.com/markmead/hyperui/blob/main/LICENSE).