Live editor for CSS, Less & Sass - Magic CSS

Live preview of CSS/Less/Sass code changes. Auto-save file, autocomplete, Less/Sass to CSS, beautify, CSS reloader, lint, ...

What is Live editor for CSS, Less & Sass - Magic CSS?

"Live editor for CSS, Less & Sass - Magic CSS" is a dynamic browser extension that allows developers to write and preview CSS, Less, or Sass code in real-time. It provides features like auto-saving, autocomplete, code beautification, minification, and CSS reloading without page refreshes. With support for live editing directly on web pages, automatic selector generation, Emmet, a color picker, and lint functionality, it streamlines the workflow for creating and testing web designs on-the-fly. Available for Chrome, Edge, Firefox, and Opera, this extension accelerates development and is also open source, ensuring ongoing improvement and transparency.

Download

Extension stats

By: https://webextensions.org

View on Chrome Web Store

Users: 70,000+

Rating: 4.64 (266) ▲ 1 new ratings

Version: 8.22.5 (Last updated: 2024-07-24)

Creation date: 2020-04-17

Risk impact: Very low risk impact

Risk likelihood: Very low risk likelihood

Manifest version: 3

Permissions:

activeTab
storage
unlimitedStorage
scripting
offscreen

Size: 2.25M

Email: we*****@gmail.com

URLs: Website

Ranking

# 3230 ▲ 1

Other rankings

#622 in Developer Tools

#3 in css editor keyword 31

#9 in editor keyword 44 ▲ 2

#9 in live keyword 53 ▲ 9

#19 in no code required keyword 15 ▲ 1

Upgrade to see more rankings

Other platforms

Live editor for CSS, Less & Sass - Magic CSS (v8.10.2)

4.56

(43) 1,849+

Not available on Edge

Want to check extension ranking and stats more quickly for other Chrome extensions? Install Chrome-Stats extension to view Chrome-Stats data as you browse the Chrome Web Store.

Extension summary

Analyze keywords

Run this extension and start writing your CSS/Less/Sass code which gets applied immediately. The code you write will be saved in the browser extension's storage space or the site's local storage.

Featuring:

✓ Live editor for CSS/Less/Sass code - Preview changes as you write code ✓ Autocomplete ✓ Live edit CSS files and auto-save on file system ✓ Open code editor in external window ✓ CSS reloader ✓ Option to reapply styles automatically ✓ Syntax Highlighting ✓ Auto-generate CSS selectors with point-and-click ✓ Emmet support ✓ Color picker ✓ Convert code from Less/Sass to CSS

User reviews

These summaries are automatically generated weekly using AI based on recent user reviews. Chrome Web Store does not verify user reviews, so some user reviews may be inaccurate, spammy, or outdated.

Pros

Easy to use and very helpful for practicing CSS.
Great for adding and testing custom CSS quickly.
Stable and less intrusive compared to similar extensions.

Cons

Experiences issues on specific websites.
Some users report it stops working unexpectedly.
There may be a slight delay in applying CSS styles.

Most mentioned

Works great and is a favorite among users.
Helpful for theme creation and custom styling.
Users seek support for issues on specific platforms or browsers.

Recent reviews

zsh2517, 2024-11-14

Works great. Probably the best custom CSS extension. I'm reinstalling my OS. Where can I find the CSS files, so that I can save them?

Jovan Ralic, 2024-10-19

Magnifique extension, bien pensée et efficace. Seul bémol : petit laps de temps supplémentaire pour le chargement du style CSS, qui ralentit donc un peu le site web. Je pense que ce défaut est cependant incontournable.