We have all come across front-end codes that we don't understand because of lack of visual cues. . So to make it easier Hover Preview provides you with a quick preview of what it the element would look like in the browser.
Hi all,
A solo open-source developer here. I'll brief you on my latest vscode extension Hover preview.
What is Hover preview?
Hover preview is a simple vscode extension that provides a live preview while hovering on HTML elements.
Why use Hover preview?
1. Less toggling between Browser and VsCode.
2. Get quick glance of the elements.
3. Easier to learn new CSS frameworks.
4. Easily understand other's code with visual preview, making it ideal learning tool.
5. Save time.
6. Improve productivity.
Features of Hover Preview 🌟
1. Preview HTML pages on Hover.
2. Preview Specific elements.
3. Configure screen size.
Is it free to use?
yes, its free to use, however, if you want to support the open-source development you can purchase an optional on-time license license https://github.com/PaulleDemon/H..., With license you would get priority support, free developer/ SaaS landing pages and much more.
Github page: https://github.com/PaulleDemon/H...Marketplace extension: https://marketplace.visualstudio...
Thanks @semanser, react and component based library will be soon supported, you can check the roadmap. If you like to keep along, feel free to star the repo
Wow, @art_paul, this is such a brilliant idea! It’s super helpful for all of us who struggle with front-end code. Less time toggling between the browser and VSCode sounds like a game-changer. Plus, learning new CSS frameworks just got a whole lot easier!
Font Tester