https://github.com/sassani134/hyperrailsui
Free Tailwind CSS ViewComponents for application UI, ecommerce and marketing with support for dark mode, RTL and Stimulus JS 🚀
https://github.com/sassani134/hyperrailsui
rails tailwind-components-library tailwindcss tailwindcss-components viewcomponent
Last synced: 4 months ago
JSON representation
Free Tailwind CSS ViewComponents for application UI, ecommerce and marketing with support for dark mode, RTL and Stimulus JS 🚀
- Host: GitHub
- URL: https://github.com/sassani134/hyperrailsui
- Owner: sassani134
- License: mit
- Created: 2024-09-13T15:50:55.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-10-12T14:48:41.000Z (over 1 year ago)
- Last Synced: 2025-06-20T06:04:11.577Z (11 months ago)
- Topics: rails, tailwind-components-library, tailwindcss, tailwindcss-components, viewcomponent
- Language: Ruby
- Homepage:
- Size: 79.1 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🚀 Hyper Rails UI
Hyper Rails UI is a collection of free Tailwind CSS viewComponents 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.
## 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 HyperRailsUI installation, if you have a Tailwind CSS project, you can copy the code and paste it into your project. Some components do use Stimulus JS.
In a Ruby on rails project you have to use ViewComponent gem to
## 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 Stimulus 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 Stimulus JS
### Share
1. Click on the 'Copy' button to copy the source code.
2. Paste the copied code into your project.
- Use the gem system
## Components
Hyper Rails UI has a wide range of freely available components. These components include:
### Application UI 🤖
- [Alerts](https://hyperrailsui.dev/components/application-ui/alerts)
- [Auth Forms](https://hyperrailsui.dev/components/application-ui/login-forms)
- [Badges](https://hyperrailsui.dev/components/application-ui/badges)
- [Breadcrumbs](https://hyperrailsui.dev/components/application-ui/breadcrumbs)
- [Button Groups](https://hyperrailsui.dev/components/application-ui/button-groups)
- [Checkboxes](https://hyperrailsui.dev/components/application-ui/checkboxes)
- [Details Lists](https://hyperrailsui.dev/components/application-ui/details-list)
- [Dividers](https://hyperrailsui.dev/components/application-ui/dividers)
- [Dropdowns](https://hyperrailsui.dev/components/application-ui/dropdown)
- [Error Pages](https://hyperrailsui.dev/components/application-ui/error-pages)
- [Filters](https://hyperrailsui.dev/components/application-ui/filters)
- [Grids](https://hyperrailsui.dev/components/application-ui/grids)
- [Header](https://hyperrailsui.dev/components/application-ui/header)
- [Inputs](https://hyperrailsui.dev/components/application-ui/inputs)
- [Media](https://hyperrailsui.dev/components/application-ui/media)
- [Pagination](https://hyperrailsui.dev/components/application-ui/pagination)
- [Progress](https://hyperrailsui.dev/components/application-ui/progress)
- [Quantity Inputs](https://hyperrailsui.dev/components/application-ui/quantity-inputs)
- [Radio Groups](https://hyperrailsui.dev/components/application-ui/radio-groups)
- [Selects](https://hyperrailsui.dev/components/application-ui/selects)
- [Side Menu](https://hyperrailsui.dev/components/application-ui/side-menu)
- [Stats](https://hyperrailsui.dev/components/application-ui/stats)
- [Steps](https://hyperrailsui.dev/components/application-ui/steps)
- [Tables](https://hyperrailsui.dev/components/application-ui/tables)
- [Tabs](https://hyperrailsui.dev/components/application-ui/tabs)
- [Textareas](https://hyperrailsui.dev/components/application-ui/textareas)
- [Toggles](https://hyperrailsui.dev/components/application-ui/toggles)
- [Vertical Menu](https://hyperrailsui.dev/components/application-ui/vertical-menu)
### Marketing 📣
- [Announcements](https://hyperrailsui.dev/components/marketing/announcements)
- [Banners](https://hyperrailsui.dev/components/marketing/banners)
- [Blog Cards](https://hyperrailsui.dev/components/marketing/blog-cards)
- [Buttons](https://hyperrailsui.dev/components/marketing/buttons)
- [Cards](https://hyperrailsui.dev/components/marketing/cards)
- [Carts](https://hyperrailsui.dev/components/marketing/carts)
- [Collection Cards](https://hyperrailsui.dev/components/marketing/collection-cards)
- [CTAs](https://hyperrailsui.dev/components/marketing/ctas)
- [FAQs](https://hyperrailsui.dev/components/marketing/faqs)
- [Footers](https://hyperrailsui.dev/components/marketing/footers)
- [Forms](https://hyperrailsui.dev/components/marketing/forms)
- [Header](https://hyperrailsui.dev/components/marketing/headers)
- [Popups](https://hyperrailsui.dev/components/marketing/popups)
- [Pricing](https://hyperrailsui.dev/components/marketing/pricings)
- [Product Cards](https://hyperrailsui.dev/components/marketing/product-cards)
- [Product Collections](https://hyperrailsui.dev/components/marketing/product-collections)
- [Sections](https://hyperrailsui.dev/components/marketing/sections)
- [Stats](https://hyperrailsui.dev/components/marketing/stats)
- [Testimonials](https://hyperrailsui.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://hyperrailsui.dev/blog/how-to-contribute) on how to contribute including examples of adding new components is available on the Hyper Rails UI [blog](https://hyperrailsui.dev/blog).
## License
Hyper Rails UI is an open source project licensed under the [MIT license]().