Skip to content

picker: encode selected color in URL so shared links work - #53

Open
Aditya30ag wants to merge 1 commit into
color-js:mainfrom
Aditya30ag:fix/picker-color-in-url
Open

Aditya30ag wants to merge 1 commit into
color-js:mainfrom
Aditya30ag:fix/picker-color-in-url

Conversation

@Aditya30ag

@Aditya30ag Aditya30ag commented Sep 14, 2026

Copy link
Copy Markdown

Closes #52

Problem

The picker only encoded color spaces in the URL (/picker/oklch+p3), never
the color value. Sharing a link always opened the default lch(50 50 50)
for the recipient regardless of what was selected.

Changes

picker/index.js

  • data() reads ?color= on load, with priority over localStorage
  • updateLocation() includes the color in its pushState call
  • New updateColorInURL() uses replaceState on every color change URL stays shareable without spamming browser history on every slider tick

Before / After

Before: /picker/oklch
After:  /picker/oklch?color=oklch(72%25%200.18%20142)

Opening the "after" URL in a other window now restores both the color space and the exact color.

@netlify

netlify Bot commented Sep 14, 2026

Copy link
Copy Markdown

Deploy Preview for color-apps ready!

Name Link
🔨 Latest commit ffe12cc
🔍 Latest deploy log https://app.netlify.com/projects/color-apps/deploys/6aa7c0181d4f10000892827d
😎 Deploy Preview https://deploy-preview-53--color-apps.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Color picker: shared links don't restore the selected color

1 participant