Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/saneef/color-color
Website to generate color palettes in Okhsl and HSLuv color spaces
https://github.com/saneef/color-color
color-palette color-schemes design-tools hsluv shades svelte
Last synced: 3 months ago
JSON representation
Website to generate color palettes in Okhsl and HSLuv color spaces
- Host: GitHub
- URL: https://github.com/saneef/color-color
- Owner: saneef
- License: mit
- Created: 2020-03-25T10:59:32.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2024-06-08T07:52:31.000Z (8 months ago)
- Last Synced: 2024-10-30T21:06:05.024Z (3 months ago)
- Topics: color-palette, color-schemes, design-tools, hsluv, shades, svelte
- Language: Svelte
- Homepage: https://colorcolor.in
- Size: 2.1 MB
- Stars: 110
- Watchers: 3
- Forks: 7
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# color × color
[![Netlify Status](https://api.netlify.com/api/v1/badges/42aa179f-b564-4251-85be-4bbfdfd501e5/deploy-status)](https://app.netlify.com/sites/color-color/deploys)
Color-color is a tool to generate color shades. Supports [Okhsl](https://bottosson.github.io/posts/colorpicker/), [HSLuv](https://www.hsluv.org) and HSL color spaces. You can generate more than one set of shades, and compare side by side. Bring in your reference colors to tune-in the color schemes.
[Designing accessible color systems](https://stripe.com/au/blog/accessible-color-systems) article by Stripe, and [Colorbox](https://www.colorbox.io) by Lyft Design inspired us.
## Get started
Install the dependencies...
```bash
npm install # Or `pnpm install` or `yarn install`
```...then start development server:
```bash
npm run dev
```Navigate to [localhost:5173](http://localhost:5173). You should see your app running. Edit a component file in `src`, save it, and reload the page to see your changes.
## Building and running in production mode
To create an optimised version of the app:
```bash
npm run build
```## Credits
- Entypo pictograms by Daniel Bruce — [www.entypo.com](http://www.entypo.com/)