https://github.com/dextor-io/component.dextor.io
Dextor Components is a lightweight and modular React component library designed to streamline UI development. Built with Tailwind CSS and Vite, it offers a collection of reusable, customizable components to help developers create responsive and modern user interfaces effortlessly.
https://github.com/dextor-io/component.dextor.io
component design frontend functional-components javascript react reuseable-components ui ui-components
Last synced: 2 months ago
JSON representation
Dextor Components is a lightweight and modular React component library designed to streamline UI development. Built with Tailwind CSS and Vite, it offers a collection of reusable, customizable components to help developers create responsive and modern user interfaces effortlessly.
- Host: GitHub
- URL: https://github.com/dextor-io/component.dextor.io
- Owner: dextor-io
- License: mit
- Created: 2024-11-17T12:31:03.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-11-22T13:09:20.000Z (over 1 year ago)
- Last Synced: 2025-10-22T16:14:46.942Z (6 months ago)
- Topics: component, design, frontend, functional-components, javascript, react, reuseable-components, ui, ui-components
- Language: JavaScript
- Homepage: https://components.dextor.io/
- Size: 405 KB
- Stars: 0
- Watchers: 0
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# **Dextor Components**
A modern React component library built with Vite and styled with Tailwind CSS. This library offers a set of reusable, customizable, and accessible UI components for rapid development.
[](https://www.npmjs.com/package/dextor-components)
[](https://github.com/dextor-io/components.dextor.io/blob/main/LICENSE)
[](https://www.npmjs.com/package/dextor-components)
## 🚀 **Features**
- **Lightweight & Fast**: Built with Vite for blazing-fast development.
- **Tailwind CSS Support**: Pre-styled components using Tailwind CSS for a consistent design system.
- **Customizable**: Easily extend and customize components to match your branding.
- **Accessible**: Components adhere to accessibility standards for an inclusive user experience.
- **Modular**: Import only what you need to optimize performance.
---
## 🌐 Website
Discover full documentation, live previews, and component guides on our official website:
👉 https://components.dextor.io/
---
## 📦 **Installation**
Install the package via npm or yarn:
```bash
npm i dextor-components
```
---
## 🔧 **Setup**
To use the components, ensure you have Tailwind CSS set up in your project. Follow these steps:
1. Install and configure Tailwind CSS in your React project. [Tailwind CSS Docs](https://tailwindcss.com/docs/installation)
2. Add the following to your `tailwind.config.js` file to include the library's styles:
```javascript
module.exports = {
content: [
"./src/**/*.{js,jsx,ts,tsx}",
"./node_modules/@dextor/components/**/*.{js,jsx}",
],
theme: {
extend: {},
},
plugins: [],
};
```
3. Import the component styles in your entry file (e.g., `index.css`):
```css
@import "@dextor/main.css";
```
---
## ✨ **Usage**
Here's an example of how to use a component from the library:
```jsx
import { Button } from "dextor-components";
function App() {
return (
alert("Hello, Dextor!")}>
Click Me
);
}
export default App;
```
## 🛠️ **Development**
Do you want to contribute or explore the source code? Clone the repository:
```bash
git clone https://github.com/dextor-io/components.dextor.io.git
cd components.dextor.io
npm install
npm run dev
```
---
## 🤝 **Contributing**
Contributions are welcome! Feel free to open issues, suggest improvements, or submit pull requests. See the [CONTRIBUTING.md](CONTRIBUTING.md) file for guidelines.
---
## 📜 **License**
This project is licensed under the [MIT License](LICENSE).
---
## 📢 **Feedback**
We’d love to hear your thoughts! Open an issue or reach out to us on [GitHub](https://github.com/dextor-io/).
---
Start building modern, elegant UIs with **Dextor Components**! 🚀