English (UK)
See more
DevTools tailored your way with real CSS
Latest Version
Version
0.2.0
Update
July 6, 2020
Size
23.88KiB
Developer
ronvoluted.com
Category
Users
0 
Rating
0 ★
Manifest Version
2
Web Store Status
Extension ID
Languages Support
Permissions
Storage
See more
Tailor Extension
Write your own bespoke CSS to style DevTools. Unlike installing themes, you can write custom rules to style any element on the fly.
1. Visit chrome://flags and enable \"Developer Tools experiments\"
2. Restart Chrome
3. Open DevTools Settings (F12, then F1)
4. Under Experiments, enable \"Allow custom UI themes\"
You'll see a new panel titled \"Tailor\" where you can add custom CSS rules to your liking. Click the Tailor button or hit Ctrl + S, then reopen DevTools. You can find more elements to target by viewing the source code of DevTools:
1. Open DevTools (Ctrl + Shift + I)
2. Undock Devtools (Ctrl + Shift + D)
3. Open DevTools for the already open DevTools (Ctrl + Shift + I) and examine the Elements panel
Read more
1. Visit chrome://flags and enable \"Developer Tools experiments\"
2. Restart Chrome
3. Open DevTools Settings (F12, then F1)
4. Under Experiments, enable \"Allow custom UI themes\"
You'll see a new panel titled \"Tailor\" where you can add custom CSS rules to your liking. Click the Tailor button or hit Ctrl + S, then reopen DevTools. You can find more elements to target by viewing the source code of DevTools:
1. Open DevTools (Ctrl + Shift + I)
2. Undock Devtools (Ctrl + Shift + D)
3. Open DevTools for the already open DevTools (Ctrl + Shift + I) and examine the Elements panel
Source Manifest.json
{"update_url": "https://clients2.google.com/service/update2/crx", "name": "Tailor", "description": "DevTools tailored your way with real CSS", "author": "Ron Au", "icons": { "128": "Tailor_128x128.png" }, "devtools_page": "devtools.htm", "background": { "scripts": [ "background.js" ], "persistent": false }, "permissions": [ "storage" ], "version": "0.2.0", "manifest_version": 2}
Read more
Similar Extensions
Inspecta - validate design implementation 0 3 ★ 420KiB
CSS Peeper 0 363 ★ 279KiB
Tailscan 0 16 ★ 1.92MiB
Gimli Tailwind 0 33 ★ 151KiB
CSS Selector Tester 0 4 ★ 30.87KiB
Atomic CSS Devtools 0 15 ★ 196KiB
View CSS 0 1 ★ 5.89KiB
CSS Debugger 0 9 ★ 13.27KiB
CSS Selector Capture Pro 0 11 ★ 116KiB
Tailwind CSS Devtools 0 7 ★ 857KiB
Inspect CSS 0 24 ★ 404KiB
Custom Style Script 0 37 ★ 49.86KiB
SelectorGadget 0 108 ★ 86.66KiB
CSSViewer 0 10 ★ 74.67KiB
CSS Selector 0 2 ★ 73.43KiB
Shopify Toolbox 0 10 ★ 38.13KiB
SCSS to CSS 0 2 ★ 2.35MiB
Html Style Copier 0 0 ★ 2.95MiB
CSS Formatter 0 4 ★ 249KiB
Website Customizer: Add Custom Style and CSS 0 2 ★ 1.45MiB
CSS Scanly - Copy CSS | Tailwind & Bootstrap 0 5 ★ 35.52KiB
RWeb 0 16 ★ 56.78KiB
Tailwind Inspector 0 1 ★ 956KiB
Web Developer Tool for Chrome 0 21 ★ 30.89KiB
