Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jesusgraterol/uipalettes
uipalettes is a Progressive Web App (PWA) that provides web developers access to a curated library of high-quality color palettes that fully comply with the Web Content Accessibility Guidelines (WCAG).
https://github.com/jesusgraterol/uipalettes
accessibility colors design design-system palette palette-generation palettes ui ui-components uikit user-interface utilities utility-application wcag
Last synced: about 14 hours ago
JSON representation
uipalettes is a Progressive Web App (PWA) that provides web developers access to a curated library of high-quality color palettes that fully comply with the Web Content Accessibility Guidelines (WCAG).
- Host: GitHub
- URL: https://github.com/jesusgraterol/uipalettes
- Owner: jesusgraterol
- License: mit
- Created: 2024-01-08T12:57:16.000Z (10 months ago)
- Default Branch: main
- Last Pushed: 2024-05-22T22:54:03.000Z (6 months ago)
- Last Synced: 2024-05-22T23:07:41.231Z (6 months ago)
- Topics: accessibility, colors, design, design-system, palette, palette-generation, palettes, ui, ui-components, uikit, user-interface, utilities, utility-application, wcag
- Language: TypeScript
- Homepage: https://uipalettes.web.app/
- Size: 5.53 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# uipalettes
![uipalettes](./readme-assets/screenshot-01.png)
**uipalettes** is a Progressive Web App (PWA) that provides web developers access to a curated library of high-quality color palettes that fully comply with the Web Content Accessibility Guidelines (WCAG).
## Live Demo
[uipalettes](https://uipalettes.web.app/)
## Getting Started
### Requirements
- GIT
- NodeJS ^v22.2.0
- NPM ^v10.7.0### Installation
Clone the repository
```bash
$ git clone [email protected]:jesusgraterol/uipalettes.git
```Install the dependencies
```bash
$ npm install
```
## Usage
Run the Development Vite Server
```bash
$ npm run dev
```Open `http://localhost:5173/` (the port may vary) with your favorite browser.
## Build Process
Run the Vite Production Build
```bash
$ npm run build
```
## Deployment
When a commit is pushed to the `main` branch, **Github Workflows** automatically pushes the new
distribution to **Firebase Hosting**.
## Built With
- HTML5
- CSS3
- TypeScript
- React
## Running the Tests
```bash
# Unit Tests
$ npm run test:unit# Integration Tests
$ npm run test:integration# E2E Tests
$ npm run test:e2e
```
## Branding
**Font:** [Montserrat](https://github.com/jesusgraterol/webfont-montserrat)
**Primary Color:** #0C0C0C
**Secondary Color:** #171717
**Success Color:** #1B5E20
**Error Color:** #B71C1C
**Warn Color:** #BF360C
**Info Color:** #0D47A1
**Text Color:** #0f172a
**Light Text Color:** #64748b
## @TODO
- ...
## License
[MIT](https://choosealicense.com/licenses/mit/)
## Acknowledgments
- [Ant Design](https://ant.design/docs/spec/colors/)
- [Bootstrap](https://getbootstrap.com/docs/5.0/customize/color/)
- [Chakra](https://v2.chakra-ui.com/docs/styled-system/theme)
- [Mantine](https://mantine.dev/theming/colors/)
- [Material Design 2](https://m2.material.io/design/color/the-color-system.html#tools-for-picking-colors)
- [NextUI](https://nextui.org/docs/customization/colors)
- [Open Color](https://yeun.github.io/open-color/)
- [Radix](https://www.radix-ui.com/colors)
- [React Suite](https://rsuitejs.com/resources/palette/)
- [Tailwind CSS](https://tailwindcss.com/docs/customizing-colors)
- [Montserrat | Google Fonts](https://fonts.google.com/specimen/Montserrat)
- [Material Icons | Google Fonts](https://fonts.google.com/icons)