UI devtools (@uidevtools) header
UI devtools (@uidevtools) profile picture

UI devtools

@uidevtools

visual devtools for tailwindcss · maintained as sponsorware by @siddharthkp: https://nitter.gq/t.co/kwBTo4aMX8

 localhost
ui-devtools.com
Joined October 2020
  • Tweets34
  • Following1
  • Followers1.4K
7Media
Photo by UI devtools (@uidevtools)Photo by UI devtools (@uidevtools)Photo by UI devtools (@uidevtools)Photo by UI devtools (@uidevtools)Photo by UI devtools (@uidevtools)Photo by UI devtools (@uidevtools)Photo by UI devtools (@uidevtools)
it's time
siddharth ☻ (@siddharthkp) profile picturesiddharth ☻
@siddharthkp9 Nov 2020
wip → ready Super freaking excited to share the browser devtools built for @tailwindcss 01 attach on top of your existing workflow 02 understands your theme 03 instant visual feedback 04 saves changes back to your code ui-devtools.com ✌️
15
📸 @uidevtools new ux idea: resize margin with mouse?
1
4
1
44
✌️🚀 0.9.1
3
2
47
📸 @uidevtools identify svg elements and show additional properties - stroke + fill setting stroke color as currentColor means it will take the parent's color property :)
1
29
📸 @uidevtools sometimes you start with a div/span and then change your mind, especially for proper semantics 😇 ui-devtools supports changing classnames, inner text and now tagName
4
2
37
📸 @uidevtools added some good old text editing, tap T on an element with text .
3
2
35
📸 @uidevtools tiny improvement, added a way to toggle border on each side because sometimes you only need border-bottom (the instant code change is very satisfying 😇)
2
1
1
26
pulled a useful snippet out from @uidevtools to open source it → Click a component while holding Alt/option to open it's source code in @code github.com/siddharthkp/babel…
24
58
3
365
📸 @uidevtools holy shit, this actually worked??? convert conditional expression to a template expression to make room for the "always" class
1
1
32
📸 @uidevtools first attempt at conditional expressions, opened up pandora's box
4
1
43
👀 @uidevtools accidentally made the transforms super super fast! should change the unit to milliseconds now! before and after:
10
1
43
📸 @uidevtools completely changed my mind about showing scale and margins. when you're resizing, you want the tool to get out of your way so you can see how Your ui looks
3
1
1
22
📸 @uidevtools warning for inaccessible text contrast + hints for colors with enough contrast AA/AAA
3
5
2
70
📸 @uidevtools showing color number on hover because I like to know which value i'm picking
2
1
52
looking for help 🙇‍♀️
siddharth ☻ (@siddharthkp) profile picturesiddharth ☻
@siddharthkp1 Apr 2021
help me out, if i were to hire someone to work with me on my side project @uidevtools, how would I go about finding that person in my network? 🕔 20 hours/month - they decide when and how they distribute that 💵 at least 2 * what they make for 20 hours with employer details ⬇️
1
4
💙🙌
Image from UI devtools (@uidevtools)
23
👀
NuxtJS support soon

ALT NuxtJS support soon

2
1
1
57
🚀 release update: ui-devtools/[email protected] this is works on my machine release for @vuejs integration 🧪😇 if you're a sponsor, you can try it out now :)
Image from UI devtools (@uidevtools)
1
3
1
26
📸 @uidevtools made a tiny breakthrough with @vuejs, vue support coming soon 🎉
2
5
70
I'm surprised how well this worked out! animating svgs with raw tailwind
siddharth ☻ (@siddharthkp) profile picturesiddharth ☻
@siddharthkp9 Dec 2020
It's been a while, going to do some live coding/stream today at 4:30pm UTC + 1 trying something different, will build this interaction concept from @.Volorf with @tailwindcss and @uidevtools not sure how well it's going to translate, we'll see 😇 📺 youtube.com/sid-studio/live
4
2
1
55
📷 @uidevtools Exploring keyboard shortcuts to improve the workflow a bit more. Shift > mb > down down down > Enter not sold on the ux yet. experiment shipped to sponsors.
1
1
1
33
Load more