Awesome
<p align="left"> <a href="https://color.obscuredetour.com/"> <img width=580 src="build/images/color-deck-logo-full.svg"> </a> <br> <a href="https://github.com/obscuredetour/color-deck/"> <img alt="Maintained?" src="https://img.shields.io/maintenance/yes/2020.svg?colorB=%234e64b7"> </a> <a href="https://github.com/obscuredetour/color-deck/commits/master"> <img alt="Last commit" src="https://img.shields.io/github/last-commit/obscuredetour/color-deck.svg?colorB=%234e64b7"> </a> <a href="https://github.com/obscuredetour/color-deck/tags"> <img alt="Tag" src="https://img.shields.io/github/tag/obscuredetour/color-deck.svg?colorB=%234e64b7&label=version"> </a> </p>Color Deck
Color Deck is a HSL driven color palette collector progressive web app made for humans.
There are quite a few color tools out there. However, none focus on HSL. It is arguably the easiest method for humans to view relationships between colors. Many color tools also arbitrarily decide how many colors should be in a palette or series. Color Deck sets out to correct these issues. Learn why HSL is great.
Table of Contents
How to use
Go to color.obscuredetour.com to use the app. For desktop & mobile app installation, see installation below.
New Print feature Try printing saved colors!
Installation
For desktop installation (Windows, Linux, Chrome OS)
- Visit Color Deck using Chromium or Google Chrome - see this for version info.
- Click the 3 dot icon to activate the menu and select Install Color Deck
For mobile installation (Android)
- Visit Color Deck using Google Chrome or Firefox
- Tap the Add to Home Screen message that pops up
- Launch the Color Deck app icon from the home screen or app drawer
For mobile installation (iOS)
- Visit Color Deck using Safari
- Go to the share menu and tap the Add to home screen option
- Launch the Color Deck app icon from the home screen
Preview
Print Feature
Contributing
Open an issue first to discuss potential changes/additions.
Thanks to others
Would like to thank James Daniel for his Color Picker iro.js. This project would have been a lot more difficult had I not found iro.js and been witness to his great documentation.
Zen Rocha for creating clipboard.js and making my 'click to copy' feature so much easier.
Lea Verou's color tool contrast-ratio.com is in use all the time and helped inspire the desire to copy color values in various formats with ease. (So you can paste them in here!)
The guys over at Refactoring UI deserve a mention for their love of HSL and the Color chapter in their book. Funny and informative, but ultimately, it helped foster my distaste for color pickers that allow you to save just 5 colors at a time.
Goals
- Implement Color wheel picker
- Implement HSL controls
- Offline use - PWA
- Save series of colors
- Click to copy (text) of various color formats
- Persistent saving (after refresh/close)
- Implement color groups within palettes
License
(The MIT License)
Copyright (c) 2019 Jeffrey Summers
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.