LiveStyle. The first bi-directional real-time edit tool for CSS, LESS and SCSS.

Secret super-powers
Download App

LiveStyle app is not yet available for your OS, but you can try manual installation.

Bi-directional

Changes are transmitted from the editor to the browser and the browser into the editor.

Google Chrome
localhost:8080

Enable LiveStyle

style.min.css
layout.css

Ayyo Movies launched a new design of Smart TV application

The main goal of the update — to create a new interface to the Smart TV applications, based on user behavior in the old version Ayyo simultaneously changing all the technical background is. Now, instead of the endless windows with films, the application consists of four sections, corresponding to the four types of audience.

style.min.css
body {
font-family: serif;
color: #000;
background: #fff;
padding: 10px;
}
layout.css
body {
padding: 10px;
color: #000;
font-size: 15px;
}
h1 {
font-size: 3em;
}

One Heart

In LiveStyle, you connect browser style sheets with files from your editor. It gives you unmatched flexibility: you can use files from your hard drive, USB, FTP, network mount or even new, unsaved files.

layout.css usb/page.css ftp://css/forms.css smb://work/cv.css untitled
body {
padding: 10px;
color: blue;
font-size: 20px;
background: darkblue;
}
h1 {
font-size: 3em;
}

And you can even edit your live web-site.

No special server setup required.

Remote View

Remote View creates a publicly available URL that points to your local web-site. Use this URL to preview local web-site on any internet-connected device or browser.

With instant real-time updates from editor and DevTools.

Ayyo Movies launched a new design of Smart TV application

The main goal of the update — to create a new interface to the Smart TV applications, based on user behavior in the old version Ayyo simultaneously changing all the technical background is. Now, instead of the endless windows with films, the application consists of four sections, corresponding to the four types of audience.

Another browser

Ayyo Movies launched a new design of Smart TV application

The main goal of the update — to create a new interface to the Smart TV applications, based on user behavior in the old version Ayyo simultaneously changing all the technical background is. Now, instead of the endless windows with films, the application consists of four sections, corresponding to the four types of audience.

Virtual Machine

Ayyo Movies launched a new design of Smart TV application

The main goal of the update — to create a new interface to the Smart TV applications, based on user behavior in the old version Ayyo simultaneously changing all the technical background is. Now, instead of the endless windows with films, the application consists of four sections, corresponding to the four types of audience.

Tablets

Ayyo Movies launched a new design of Smart TV application

The main goal of the update — to create a new interface to the Smart TV applications, based on user behavior in the old version Ayyo simultaneously changing all the technical background is. Now, instead of the endless windows with films, the application consists of four sections, corresponding to the four types of audience.

Mobile phones
Google Chrome
localhost:8080

Remote View
some-name.livestyle.io

Ayyo Movies launched a new design of Smart TV application

The main goal of the update — to create a new interface to the Smart TV applications, based on user behavior in the old version Ayyo simultaneously changing all the technical background is. Now, instead of the endless windows with films, the application consists of four sections, corresponding to the four types of audience.

style.min.css
layout.css
body {
padding: 10px;
color: blue;
font-size: 20px;
background: #ccc;
}
h1 {
font-size: 3em;
}

  • Real-time editing

    LiveStyle updates CSS in browser immediately, as you type. No more file saving or page reloading just to see how single update affects web page.

  • Browser → Editor

    Ever wanted to tweak layout in DevTools and get those changes into your source code? LiveStyle is the only tool that can do this right. And it works with LESS and SCSS too.

  • Use your own tools

    LiveStyle doesn’t require any special build tool or web server to work. It integrates directly into your editor and browser. Currently works in Google Chrome and Sublime Text. Atom plugin is available for beta testing.

  • Any scale

    LiveStyle designed to work with projects of any scale: from small single-page apps to huge web-sites like Facebook. And you can even work with your live web-site!

  • Easy cross-browser testing

    With Remote View feature you can easily preview your local web-site on any internet-connected browser and device. With live updates from editor and DevTools.

  • Cross-platform

    LiveStyle works everywhere your browser and editor does.

Download App

LiveStyle app is not yet available for your OS, but you can try manual installation.

Plus