https://github.com/ondrejlosensky/components-library

My personal UI Library made primarily for Next.js but also compatible with pain React. Used in some of my projects
https://github.com/ondrejlosensky/components-library

design-system ui-components

Last synced: 20 days ago
JSON representation

My personal UI Library made primarily for Next.js but also compatible with pain React. Used in some of my projects

• Host: GitHub
• URL: https://github.com/ondrejlosensky/components-library
• Owner: OndrejLosensky
• Created: 2024-10-19T06:12:04.000Z (4 months ago)
• Default Branch: master
• Last Pushed: 2025-01-13T20:19:33.000Z (23 days ago)
• Last Synced: 2025-01-13T20:39:57.808Z (23 days ago)
• Topics: design-system, ui-components
• Language: TypeScript
• Homepage: https://components-library-lake.vercel.app/
• Size: 228 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# My Personal UI Component Library

A modern, accessible, and type-safe UI component library built with React, TypeScript, and Tailwind CSS. Designed to provide a comprehensive set of components that are both beautiful and functional out of the box, while remaining highly customizable.

## Features

✨ **Modern Stack**

- Built with React + TypeScript

- Styled with Tailwind CSS

- Full responsive design

- Dark mode support

🎨 **Design System**

- Consistent design language

- Customizable theming

- Flexible component variants

- Icon system integration

♿️ **Accessibility**

- WAI-ARIA compliant

- Keyboard navigation

- Screen reader friendly

- Focus management

🛠 **Developer Experience**

- Type-safe components

- Comprehensive documentation

- Intuitive API design

- Consistent patterns

## Components

The library includes a growing set of components including:

- Buttons

- Inputs

- Cards

- Alerts

- Tooltips

- Toggles

- Select menus

- And more...

Each component is:

- Fully typed with TypeScript

- Customizable via props and Tailwind classes

- Accessible by default

- Responsive out of the box

## Example Usage

```tsx

import { Button, Input, Card } from '@ui/components';

function MyComponent() {

  return (

    

      } 

        placeholder="Search..." 

      />

      

        Submit

      

    

  );

}

```

## Contributing

Contributions are welcome! Please read our contributing guidelines before submitting a pull request.