SimeonGriggs
API throws CORS error
Hey, first off this is great! I've attempted to build something like this and really be struggling. The colors end up uneven or in the wrong oder. However, I'm running into cross-origin (CORS) when I attempt to use your API.
Using the example endpoint here: https://www.simeongriggs.dev/using-the-tailwind-css-palette-generator-and-api
fetch('https://tailwind.simeongriggs.dev/api/brand/2522FC')
.then((response: any) => response.json())
.then((json: any) => console.log(json));
Here's the error received:
I see!
Haven't given any consideration to fetching client side like this before and the implication to throwing the doors open on CORS ... let me do some research and get back to you
No worries Simeon. I'm going a different direction with my project, so I won't be using this for now. However, I thought you might want a heads up. No rush on my behalf needed. Thanks for the quick response though.
Since I keep getting pinged on this one, I thought I'd at least share the solution we've gone with in the meantime:
https://gka.github.io/chroma.js/
This is an extremely tiny dependency that can do a whole host of things with colors. The .scale() feature is especially nice in regards to creating color ramps like we need for Tailwind. We're making heavy use of it for the open source theme generator I'm currently building for my UI library.
This is more of a "build it yourself" option, but just thought I'd share in case it helps others out.
Confused as to how to use this "API" if it cannot be called from outside servers? Hopefully it can be made useful some day. Tints.dev works great though, just wish the "API" was able to use no-cors
I ended up creating a PHP script, that used curl to query the tints.dev Palette API endpoint , on my server. I then use that local endpoint instead. Works great!
