[feat]: Update theme for tailwind v4

[alireza-asgharii]

Feature description

🚀 Website Theme Update for the New Tailwind CSS Version

With the release of the latest Tailwind CSS version, several important changes and optimizations have been applied to the color system and styles. To ensure better compatibility and take advantage of new features, the website themes have been updated.

🔹 Key Changes:

✅ Support for the new OKLCH color space for better color accuracy
✅ Improved accessibility in background and text colors
✅ New variables added for the Sidebar
✅ Adjusted some colors and borders for better consistency

⚡ Actions Taken:

🔹 Replaced hsl color values with oklch
🔹 Updated color variables in :root
🔹 Defined new variables for the Sidebar
🔹 Increased --radius value for a more modern design

✨ This update ensures a better visual experience across the website! 🚀

Affected component/components

No response

Additional Context

Additional details here...

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues and PRs

[jorgetoh]

up

[johnnybinh]

what is the workaround for now to apply theme from shadcn website?

[alireza-asgharii]

what is the workaround for now to apply theme from shadcn website?

I am waiting for the website itself to update for the theme. But the codes can be replaced by updating from the previous version to 4 as written on the site, but it is a bit difficult because the theme must be updated in general with the new version of tailwindcss.

[shadcn]

@alireza-asgharii Not sure if you have already started working into this but this is currently in progress. I have a new theme builder coming soon.

[alireza-asgharii]

@shadcn

Thanks

[johnnybinh]

@shadcn
Thanks.
Keep up the good work!

[stefan-xyz]

+1

[thekesslereffect]

is there an extension you recommend to color pick oklch in vscode? I can't seem to find one.