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: 17 days 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 (over 4 years ago)
• Default Branch: master
• Last Pushed: 2024-06-08T07:52:31.000Z (about 1 month ago)
• Last Synced: 2024-06-08T08:50:28.676Z (about 1 month ago)
• Topics: color-palette, color-schemes, design-tools, hsluv, shades, svelte
• Language: Svelte
• Homepage: https://colorcolor.in
• Size: 2.1 MB
• Stars: 107
• Watchers: 3
• Forks: 7
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Lists

• awesome-stars - color-color

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/)