Subscribe
Sign in
Windy — Transform every HTML element on any website to Tailwind CSS
Windy is a browser extension that allows you to copy any HTML element on a website and transform it into HTML with Tailwind CSS classes.
43
Replies
Best
@marcelpociot Great extension Marcel. Definitely will use it. I'm just enjoying your Electron course :)
This is pretty cool - I'm curious how do you do this for something like colors where you don't have an exact match? Do you approximate the hex to the closest tailwind color?
@bilater Thank you! Yeah, right now we just get the closest color from the Tailwind color pallet. But in the future I also want to add the ability to write a custom Tailwind config file that can be used with the copied HTML.
So I've got a problem with the plugin. I've sent a couple of emails to support about it. It isn't copying the majority of pages I'm trying correctly. Seems like flex and grid are off and not working or copying at all. The only site I've gotten it to work on is the actual Windy site.
@john_hayes2 I am not one to usually write negative reviews and don't plan on doing that completely here. What I want to make known is that this plugin is far from useful at the moment. It works on a small amount of sites currently and can definitely benefit those who use it for simple purposes. If you plan on using it for migrating an existing site, you may want to continue with your current workflow or find another tool that will be more beneficial than this current iteration of Windy. Don't get me wrong, I believe this plugin is going to be a huge time-saver and be extremely useful in the future. For now, it is just not at that point. I guess what I'm saying is that if you make the purchase and expect to be able to use the plugin with immediate satisfaction or to add it into your current workflow, you may be disappointed. Beyond Code is an excellent team and have excellent products, but this one is not ready for mainstream or even an early release in my opinion. If you want to use it to copy HTML without opening devtools and to get some insight into TailwindCSS classes, then you may very well be happy. For me, this is not the case and I am going to have to discontinue my usage until the plugin is more polished and beneficial for myself. At the current price point, I don't mind paying extra for the plugin when it is more polished. If you are the type of person to kickstart products, then I would suggest buckling up and staying in for the ride. I really look forward to seeing what has become of Windy in a few months. Good luck to you all and to the team at Beyond Code. Last, thanks for being an innovator and putting out some great products Beyond Code.
@john_hayes2 Thank you for your detailed review! We are indeed working on improvements and version 1.0.6 got released today. This version does a better job at detecting styles that have been merged from parent components, etc.
We believe that there are many improvements in the upcoming months and that we are able to make it work on complex sites too :)
@slyfirefox Thank you! Yeah, converting existing websites, regardless if they are using Bootstrap or any custom CSS framework is a great use case for Windy.
@marcelpociot is this product still alive? Can we use custom tailwind configs (for colors and other stuff)?
@andre92 Yes, it is! We released a new version recently that now allows you to customize the Tailwind configuration, and adds a lot of performance and conversion improvements.
I’m not a front-end developer, but I need to do that task sometimes and when I read about Windy, the meme “shut up and take my money” became a reality. A great tool that I hope that grow a lot next year.
Recently started using it while migrating a legacy system that was full of random css; both inline and split into several files.
I am not sure but the feeling is that my productivity went up by about 1000% while also getting rid of most of the boring stuff. Mostly do back-end work so this service is just even more amazing to me because of that.
The fact that it lets me spend time on fine tuning the code instead of mindlessly smashing away on the keyboard is worth soo much! Getting it was a no brainer and im just sad it wasnt a part of my stack earlier!
Going to stop now since im getting the feeling im starting to sound like a crazy person.
Enough of the ranting; i love Windy and so will you!
@kwickell Woah...thank you so much, Kim! I'm so happy that Windy increased your productivity and even made your work less boring!
Great product, a small downside is that it does copy lots of inline styles as well.
Best used with simple designs only.
@szabi_zsoldos Thank you! Yeah, all styles that can not be mapped to Tailwind classes get added as inline styles. We thought about adding a feature that generates a custom Tailwind config file instead.
I agree with Jose that purchasing this product was simply a no brainer! I also own Tinkerwell which is an integral part of my development workflow now. The team at Beyond Code have a great sense of what the community needs and more importantly the skills to create quality products that meet that meet that very need :)
Another amazing project from @marcelpociot
If you're new to tailwind or a seasoned user this is the perfect tool to speed up your work and actually get work done fast! Would definitely recommend.
This is an early alpha release and contains several bugs with limited functions.
The idea is really great!
@andreas_ek Thank you for your feedback. The core feature - which is copying element style as HTML with Tailwind classes is probably the most important one. That's also why Windy launched as "early access". We are gathering feedback and look into edge cases, as well as add more features for the launch early next year. So I think Windy will only get better over time.
Windy paid for itself in the first two hours after we purchased it. I transitioned a bootstrap 4 site and saved a solid two days in fiddling around with layouts, fonts, and table styling. Completely worth it, can’t say enough about it.
@spencerrlongg Thank you! Reviews like yours are the reason why we create developer tools ❤️
For backend developer frontend is sometimes really hard. TailwindCss was a huge paradigm shift for me but I was still missing something. Now Windy has completely filled this gap. I love it!!!
Pretty much all tools that @marcelpociot and Beyondco.de make are exceptional and help me make my workflow much much faster.
Windy is no exception
Its really helpful to copy html elemets with styles. Good one, No need write exta css
Tinkerwell