Effortlessly detect and customize shadcn/ui themes to suit your needs.

Latest Version

Version
1.1
Update
December 4, 2024
Size
23.73KiB
Developer
Category
Users
11
Rating
5 ★
Manifest Version
3
Web Store Status
Languages Support
English
See more
Permissions
ActiveTab
Scripting
Tabs
See more

shadcn/ui Designer Extension

shadcn/ui Designer is a browser extension designed for developers and designers working with the shadcn/ui component library. It detects whether a web page uses shadcn/ui and allows you to edit its theme directly in your browser.

With this tool, you can easily modify primary, secondary, accent, and other theme colors through an intuitive interface. Your theme updates are now saved even after refreshing the page, and you have a reset button to quickly revert to the default settings. Immediately see your changes applied on the page and export the customized theme as a CSS file for seamless integration into your project.

Save time, streamline your workflow, and perfect your designs with shadcn/ui Designer—an indispensable tool for anyone working with shadcn/ui.
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 3, "name": "shadcn/ui Designer", "version": "1.1", "description": "Effortlessly detect and customize shadcn/ui themes to suit your needs.", "permissions": [ "activeTab", "scripting", "tabs" ], "host_permissions": [ "https://*/*", "http://*/*", "file://*/*", "http://localhost/*" ], "background": { "service_worker": "background.js" }, "action": { "default_popup": "popup.html", "default_icon": { "16": "icons/icon16-disabled.png", "48": "icons/icon48-disabled.png", "128": "icons/icon128-disabled.png" } }, "icons": { "16": "icons/icon16.png", "48": "icons/icon48.png", "128": "icons/icon128.png" }}
Read more

Similar Extensions

icon

Udemy Dark Theme Extension · Accessibility 11 4 ★ 35.78KiB

icon

Custom selection Extension · Productivity 11 9 ★ 71.73KiB

icon

Discord Theme Customizer Extension · Fun 11 31 ★ 199KiB

icon

UI Inspector - Live Style Editor Extension · Developer Tools 11 2 ★ 90.41KiB

icon

Web Editor Extension · Developer Tools 11 29 ★ 68.98KiB

icon

Overleaf Dark Pro Extension · Productivity 11 1 ★ 694KiB

icon

IsWordPress - WordPress theme plugin detector Extension · Developer Tools 11 8 ★ 213KiB

icon

Adjust Page Brightness Extension · Accessibility 11 165 ★ 122KiB

icon

Dark Mode - Dark Theme for Chrome Extension · Accessibility 11 36 ★ 883KiB

icon

Inspecta - validate design implementation Extension · Developer Tools 11 3 ★ 420KiB

icon

Screen Dimmer Extension · Accessibility 11 9 ★ 863KiB

icon

Monochrome Mode: Grayscale browsing Extension · Productivity 11 6 ★ 120KiB

icon

Dark Mode - Dark Reader for Chrome Extension · Accessibility 11 46 ★ 399KiB

icon

Dark Theme - Dark Reader for Web Extension · Accessibility 11 377 ★ 347KiB

icon

Dark Theme - Dark Reader for Chrome Extension · Productivity 11 351 ★ 836KiB

icon

Liquify - Shopify Code Search & Editor Extension · Developer Tools 11 27 ★ 62.93KiB

icon

WebTitleIconChanger Extension · Productivity 11 1 ★ 41.44KiB

icon

Custom Dark Mode Extension · Productivity 11 13 ★ 90.07KiB

icon

CoolStyles - Create Theme for any website Extension · Accessibility 11 256 ★ 139KiB

icon

Codeforces Themes Extension · Productivity 11 1 ★ 44.07KiB

icon

Night Shift - Dark Theme for WEB Extension · Productivity 11 0 ★ 57.45KiB

icon

Dark Mode for Chrome Extension · Productivity 11 5 ★ 257KiB

icon

The Black Cat Extension · Fun 11 0 ★ 1.34MiB

icon

Onshape Dark Mode Extension · Productivity 11 4 ★ 237KiB