Live preview of vanilla CSS as I change it?

This page summarizes the projects mentioned and recommended in the original post on news.ycombinator.com

Our great sponsors
  • WorkOS - The modern identity platform for B2B SaaS
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • SaaSHub - Software Alternatives and Reviews
  • devd

    A local webserver for developers

  • There are plenty of solutions to that specific problem. Nowadays, I only work on Nuxt/Next/Astro projects that come with hot reload out of the box so I don't have a need for it anymore, but I have used https://github.com/cortesi/devd a lot in the past, with much success.

    A no-install solution would be to use the "workspace" feature of Chrome's Dev Tools:

    1. Open your .html file in Chrome.

    2. Open the Dev Tools.

    3. In the "Sources" tab, activate the "Filesystem" sub-tab.

    4. Click on "+ Add folder to workspace" and choose the directory containing your .html and .css files.

    5. Edit the .css file with autocompletion and live preview.

    6. Save your work so that it is synchronized with your filesystem.

    In action: https://i.imgur.com/slcSt9X.gif

  • parcel

    The zero configuration build tool for the web. 📦🚀

  • The simplest solution might be to use parcel https://parceljs.org/

    > The zero configuration build tool for the web.

  • WorkOS

    The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.

    WorkOS logo
NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts