This project is a UI component collection built with Nuxt 3 and Vuetify, designed to offer a variety of ready-to-use, elegant UI elements such as cards, carousels, grids, and more. Each component provides CSS-only and Vuetify-based implementations, allowing easy integration and flexibility depending on your project’s requirements.
- Pre-designed UI Components: Includes a variety of UI elements like cards, carousels, and grids.
- CSS-only and Vuetify Options: Choose between CSS-only or Vuetify implementations for each component.
- Elegant and Clean Design: All components are designed for visual consistency and ease of customization.
- Optimized for Nuxt 3: Fully compatible with Nuxt 3, offering fast and efficient rendering.
To get started, follow these steps:
-
Clone the repository:
git clone https://github.com/oooFreaKooo/UI-Collection.git
-
Navigate into the project directory:
cd UI-COLLECTION -
Install the dependencies using Yarn:
yarn
-
Start the development server:
yarn dev
- Cards: Multiple card layouts with options for CSS-only and Vuetify implementations.
- Carousels: Image and content carousels with responsive design.
- Grids: Customizable grid layouts for displaying content in structured ways.
After starting the development server, navigate to the desired component in the UI collection to explore its options and usage examples. Each component will have buttons to directly access either the CSS-only or Vuetify version of the component.
To build the application for production:
yarn buildAfter building, you can start the production server:
yarn startTo lint your code, run:
yarn lintTo automatically fix linting issues, run:
yarn lint:fixIf you'd like to contribute new components or improvements, feel free to open a pull request. We welcome all contributions that help make this UI collection more comprehensive and user-friendly.
This project is licensed under the MIT License.