holbrookdev/ok-color-picker

🎨 Pick colors using the Okhsv and Okhsl color spaces (based on Oklab).

Ok Color Picker

Pick colors using the Okhsv and Okhsl color spaces (based on Oklab).
Explore the app »

Report Bug · Request Feature

About The Project

Built With

• TypeScript
• Vite
  • Vite Plugin PWA
  • vite-plugin-singlefile

License

Distributed under the MIT License. See LICENSE for more information.

Acknowledgments

• Björn Ottosson (created Oklab, Okhsv, & Okhsl)

Copyright © 2022 Brian Holbrook

(back to top)

ok-color-picker's Issues

Wrong argument reference

Hey there, I think this project is great. I was reading through the code and noticed this line in which the second argument of this function is overwritten with a value derived from the first...

ok-color-picker/src/utils/color.ts

Line 134 in 994d289

srgb2 = <Color>srgb1.map((v) => v / 255);

I could submit a PR if you like 😉

store Color Code in URL

one thing i do often is keep multiple tabs of OK Color Picker open to create a palette.

since the color code isn't stored in the URL, i lose my picked color when reloading the page.
this isn't only a problem when i accidentally reload the page, but especially when my browser automatically puts the tab in sleep mode:

after opening the tab in sleep mode, the page has to reload, so because the color code isn't stored in the URL i have to restart with the default color.

---

YouTube player stores the video ID in the URL so that reloading the page keeps the video you meant to watch instead of returning to the start page, and it makes it possible to share videos. the format is broken down like this:

1. static part: https://www.youtube.com/watch?v=
2. video ID, e.g. dQw4w9WgXcQ

together they make the complete video link:
https://www.youtube.com/watch?v=dQw4w9WgXcQ

BeepBox uses a similar format to store song data:

1. static part: https://www.beepbox.co/#
2. song data, e.g. 9n10sbk0l00e03t2Qa7g03j03r1i0o4T0v1u10f0qg01d04w2h0E0basp1RFE-430R9HYkzE8X3nViOOHb8W2ehdvBbbaIIzI8WOfcP9vgCR-X3n

together they make the complete song link:
https://www.beepbox.co/#9n10sbk0l00e03t2Qa7g03j03r1i0o4T0v1u10f0qg01d04w2h0E0basp1RFE-430R9HYkzE8X3nViOOHb8W2ehdvBbbaIIzI8WOfcP9vgCR-X3n

OK color picker would benefit from a similar format:

1. static part: https://ok-color-picker.netlify.app/#color=
2. color code, e.g. aa9eef

together these parts would make the complete color link:
https://ok-color-picker.netlify.app/#color=aa9eef