Ripple UI

Welcome to the RippleUI repository! This is the home for all of the components, guidelines, and tools that make up our design system.

Documentation

Visit https://ripple-ui.com to view the full documentation.

🚀 Usage

To use the RippleUI components, you will need to install the package from npm.

npm install rippleui

Once you have installed the package, you can import the plugin into your tailwind.config.js.

module.exports = {
  // ... the rest of your config
  plugins: [require("rippleui")],
};

To use a component, simply include the appropriate HTML markup in your project and apply the relevant classes using the class naming.

<button class="btn-primary btn">Click me!</button>

🎨 Components

Here is a list of all of the components that are currently available in RippleUI.

Button
Input
Select
Checkbox
Radio
Switch
Textarea
Modal
Button-Group
Tooltip
Dropdown
Badge
Navbar
Avatar
Breadcrumb
Drawer
Alert
Table
Card
Accordion
Tabs
Pagination
Divider
Skeleton
Stepper
Link
Dots (Status)
Range
Progress
KBD
Forms
Menu
Popover
Sidebar
Spinners / Loaders
Input File
More components soon....

🤝 Contributing

We welcome contributions to the design system! If you have ideas for new components, improvements to existing ones, or updates to the guidelines and tools, please open a pull request with your proposed changes.

License