Piny - Visual Tailwind CSS Editor for Astro

🚀 Piny now fully supports Astro! 🎉 Learn how to supercharge your Astro development workflow with Piny, the visual editor for Tailwind CSS that runs directly inside VS Code, Cursor, and Windsurf. In this video, we cover: What Piny is and how it integrates with your code editor. How to install and open Piny for your Astro projects. Using Piny's visual tools (Tree Panel, Visual Controls, Inspector) to easily edit Tailwind CSS classes in your .astro files. Handling responsive design and element states visually. Editing Tailwind classes defined in variables or functions. Navigating complex Astro projects effortlessly. ✨ Piny Pro Features for Astro: Visual Select: Click elements directly in the live preview to jump straight to their source code. Hot Reload for Astro Files: Experience true hot module replacement (HMR) for Astro layouts, pages, and components, preserving state and scroll position for faster iteration (unlike default Astro behavior). Multi-Select Editing: Edit Tailwind classes on multiple elements simultaneously. Whether you're new to Astro or a seasoned pro, see how Piny (both the free and Pro versions) can streamline your development process and make working with Tailwind CSS in Astro a breeze. Links: Get Piny: https://getpiny.com Learn more about Astro: https://astro.build/