7 Free CSS Editors, Which Is the Best? You Choose.

September 15, 2008 by Paul Andrew CSS

I have always used Dreamweaver, and love it. But, I have been thinking, what are the FREE CSS editors like? So I went looking , first one I found was TopStyle Lite, it was OK, nothing special, and then tried some others.
It did get me thinking, Which is the best FREE CSS Editor available? So, over to you, what do you think?

I have listed 7 Free CSS Editors to help with your choice. If I have missed any, write a comment and I’ll add it to the list.

Vote at the bottom of the Article.

Simple CSS

Features :Simple CSS allows you to easily create Cascading Style Sheets from scratch, and/or modify existing ones, using a familiar point-and-click interface. Compatabile with Mac, Windows and Linux.
Download: Simple CSS Download Page.

TS Webeditor (tswebeditor)

Features :tsWebEditor is an editor for HTML, PHP, Perl, JavaScript, CSS and many other languages. It displays the source code colored (syntax highlight), code hint for functions, code completion (PHP, JavaScript, ASP, HTML), code browser, PHP debugger and syntax validation, help, CSS wizard, HTML tag editor, HTML syntax validation, and an easy to use SQL Designer. To view all features click here.
Download: TS Webeditor Download Page.

A Style CSS Editor

Features :Visual easy-to-use interface ; Graphic tree-type view of attachment files and the CSS structure ; Grouped view of properties and selectors ; Automatic selection and grouping of CSS selectors from a markup language document ; Source CSS, HTML, XML highlight code editor ; Active preview current selectors and documents with IE and Mozilla support ; Clean up HTML document via CSS ; Icon associate dictionary ; Copy, Paste and Cut operations ; Drag and Drop operations…
Download: A Style CSS Editor Download Page.

CSSED – “A GTK-2 CSS Editor”

Features :It features syntax highlighting, syntax validation, MDI notebook based interface, quick CSS properties and values insertion, auto-completion and dialog-based insertion of CSS complex values.
Being a CSS editor, its not limited to this language. CSSED haved some support for HTML (with embbeded Javascript), XML, Javascript, Java, PHP, JSP, C, C++, Apache configuration files, .htaccess, Python, Perl, SQL, SH and other languages so it can serve quite well as multi-purpose editor.
Download: CSSED Download Page.

ELEDO – Eledicss

Features :Eledicss is a CSS2 editor (GPL licensed) implemented as a server-side PHP script. It allows editing CSS files using a web browser.
It can be installed both on UNIX and Windows webservers. It was tested on PHP 4.1.2 on server side, and Mozilla 1.0 on client side. Eledicss should safetly work on all PHP 4.X versions.
Download: ELEDO Download Page.

JustStyle CSS Editor

Features :JustStyle CSS Editor is full-featured, yet easy-to-use, software for webmasters. It is a specialized style sheets development environment, featuring everything needed to develop and deploy cascade style sheets. JustStyle CSS Editor provides an interactive user interface and presents CSS properties in special wizards and generic value lists.
Written entirely in Java, it works on different platforms, such as Microsoft Windows, IBM OS/2, Linux, Apple Mac OS, Mac OS X and others.
Download: JustStyle CSS Editor Download Page.

TopStyle Lite

Features :Click here to read the differences between TopStyle Pro and TopStyle Lite. This small freeware version still has plenty of power for most CSS editing.
Download: TopStyle Lite Download Page.

[poll id="2"]

http://blog.aditu.de Tobi

Notepad++ is my tool for all: PHP/HTML/CSS/Java/C/C++ etc. and I’m really pleased with it!
http://orzdream.cn/ NetPuter

Haven’t try it yet..
http://www.ronildo.com.br/blog Ronildo Costa

I prefer use Aptana, its a wonderfull IDE.
http://traficantedenubes.org dario

Coda, IMHO, is my choice.
aravind

you missed one of the best.. CODA 1.5
Pingback: Selección de 7 editores de CSS gratuitos » Cosas sencillas
jackcheez

I second Aptana, it rocks for CSS.
Pingback: Selección de 7 editores de CSS gratuitos
Convoluted

What about firebug?
James

Hi, I found your blog on this new directory of WordPress Blogs at blackhatbootcamp.com/listofwordpressblogs. I dont know how your blog came up, must have been a typo, i duno. Anyways, I just clicked it and here I am. Your blog looks good. Have a nice day. James.
Pingback: 7 editores CSS gratuitos
http://mrvasseur.com stov

I really happy with PSPad. Just ctrl+space and you have auto-completion for many languages. I tried Aptana wich is great for PHP, but is not such a big deal for CSS in my opinion.
I’m quite interested in TS Webeditor. I’m gona try it right know and give you some feed back.
I hope to see the result of this test. Great idea. thx
Pingback: Editores CSS gratis
Pingback: Discover The Best Of The Web In September 2008 - Opensource, Free and Useful Online Resources for Designers and Developers
andrej

firebug
http://aloestudios.com Andy Ford

It’s not free, but on Mac CSSEdit is definitely worth the 30 Euros. On Windows, all my coding is handled in Notepad++ (free).
http://www.fyfi.net munky

PSPad for everything (PHP, JavaScript, CSS, XHTML)
Lonny

I’m using eclipse and the WTP for web development. It’s of cause really heavy weight, but it features good editors (syntax highlighting, outline view, code completion, code templates, code folding) and useful things like a svn plugin (do you use a version control system?)
Pingback: 21 Most Wanted And Essential Resources Specially If You Are Developer - Opensource, Free and Useful Online Resources for Designers and Developers
http://www.macoteca.com glucko

Notepad ++ for Windows is one of the best for everything, but the best css editors without any doubt are only for mac OSX: Coda, CSSEdit (the best) and Textmate. These are just awesome!
Pingback: Nên dùng cái gì để soạn thảo C, HTML, CSS, Javascript, Java, C# | Oh I see
Pingback: 21 Most Useful Free Resources For Designers And Web Developers | SulVision
Pingback: del.icio.us entre 15.10.2008 e 02.11.2008 | Fábio Caparica
http://www.anonagareboshi.co.cc Riyan

wow…. thats all is good thank for the information
Pingback: Links KW46: CSS Editoren, Webdesign & Farbe, Redesign Beispiele,… » webdesign joomla online business marketing geeks und das web 2.0
Pingback: 7 Free CSS Editors, Which Is the Best? You Choose | WhiteSandsDigital
http://blog.mar.sg Googooboyy

Honestly, none matched up to my expectations. The one with promise of potential, and of note, was JustStyle CSS Editor. I’d like to see the Author improve upon it, or somone taking over the project and expanding it, while maintaining the easy to use interface.
Luke

Notepad++ is defiantly best. you can change the language (ie. html, css, java, javascript and many more) depending on how complicated your coding is it will auto-close tags and so on. try it guys!
Link:http://notepad-plus.sourceforge.net/uk/site.htm
http://freedomeditor.com/ Bart Bosma

Try my program aswell. It can use TinyMCE, so only very basic CSS or HTML knowledge is needed.

If i need to convince you to try this program, goto freedomeditor.com, click documentation and view the Tutorial about creating a new HTML document.
http://www.leapbrowser.com reift

are H1 tags embedded in ccs style sheets? is that why in web ceo i have none to edit?
http://www.webmasterclip.com Edward.H

thanks,I have found free editor from here when I was building my website:www.webmasterclip.com
http://tasarhane.com tasarhane

nice list.. thanks..
http://www.edgarleijs.nl Edgar Leijs

Thanks for this list…. I also use dreamweaver, but for CSS editing on the go I prefer Notepad++

Gr, Edgar Leijs
http://www.ravi.uxdsign.com Ravikumar V.

Better dont use this type of external editors…
http://getwis.110mb.com getwis

I use Kompozer…

I will check those you mentioned…

Thanks,
Ertino

Probably, the softwares listed above are the best freeware css editor of ever.

Anyway I would suggest a new one: ArduoCss from http://www.arduosoft.com. Free,fast and easy-to-use.
pedro

Notepad++
http://sacscuba.synthasite.com sacscubainstr

Well as a part time guy – I really don’t appreciate any of these. I have found that once I have the general layout set, it is easier to just continue using my text editor.
http://www.voothemes.com leesa

How about rapid css and there is software call stylar which help me lots to creating blogger templates
Pingback: Naučite CSS u par minuta. | Kroativ
http://kamtizone.com kamtizone

Don’t like Dreamweaver or styleMaster which having too many menus.

Along these days I just prefer to use Programer’s Notepad.

But today I have search some other alternatives.

Thanks for your information.
Pingback: css wp question - Page 2 - Small-Business-Forum.net
Shikher

I think notepad is the best.

shikher
Pingback: Stylizer – freeware CSS editor lets you craft gorgeous websites…maybe - The Red Ferret Journal
http://emag.joreeldiaz.com joreel

For me Notepad++,CSS and Php Editor its good,easy to use and its totally free.

http://emag.joreeldiaz.com/free-php-editor-notepad/
BlackBox

Zend Studio 7
download the trial and then activate using this:

BlackBox
30505BF0C6801058BF0C6801
http://www.juanitachronowski.com Juanita

Oiko is the best imho and it runs from portable media. and it is free. also no import of the CSS file is needed it can be set to the default editor.
Clearpic

Rapid PHP Rocks
http://www.quadrifogliorosso.com Fabio

I couldn’t live without top style lite, really
Elizabeth

Cream as a subset of Vim. Any OS, any language, any preferences.
tirengarfio

Hi,

any css free editor that has color picker with the possibility of import palettes and add them to the color picker?

any that has a color generator?

Javi
sam

@tirengarfio, Check out Oiko as color picker and a lot more features
Kevin

What about Stylizer?

One of the best, and lite version is free.
Brandon

So I downloaded Amaya and right away I tried to find the attributes of an item and the help file says select the item and press F2. That doesn’t work.

So I tried topstyle and the tutorial starts off having me create a blank style sheet. then says “find the drop down to define the kind of style sheet” Can’t see it anywhere. It says press shift F9 and that brings up a file explorer window on the right.

Is it too much to ask of a WSIWYG editor that there be an obvious way to drop box on the page, size and place it? (Not a table, I want to use CSS, like everyone says I should be.)
- http://www.codelobster.com Stas
  
  I use free PHP/HTML/CSS/JavaScript Editor – Codelobster PHP Edition
  It also has HTML code inspector like FireBug has.
ghtry

CSS is approaching new levels of developer convenience. Variables inside css is a suggestion myself, and many others have had. In the meantime it’d be nice to see an editor which could support tracking these vars maybe in css comments or external file. The purpose would be quick insertion for commonly used css properties. None of these editors nor others I have researched provide this. Just my opinion ;)
Tony Spica

Have you seen CSS Spy? This one is an all comprehensive editor- no tags forgotten.

http://www.puntoequis.com.ar/aktive/default.aspx?SC=SOFT&ID=CSSSPY
http://www.webpageboom.com SEO India

nice editors.
Matt

People shouldn’t mention Coda because it is no longer free. While it used to be the best, the fact they ask for $99 kind of changes things. I can’t blame them as it is a good editor, but its certainly not worth the price. The editors he has provided are very good and FREE
shantanu

notepad ++ is best
eduard

ive tried many script editors – pspad, context, textpad, notepad. some of them dont have preview in browser function (context), or have a nag screen (textpad), or crappy syntax highlight colors (notepad). so far codelobster was the best one. im so happy with it.
Rob

Notepad++ is great, Firebug is great(and with firebug, you can add PageSpeed to optimize loading, cut out all of the unnecessary javascript, etc that makes pages “lazy”), but I do an enormous amount of very high end web design, so when I am designing really “important”, very well paying client’s sites, I use Adobe CS5 Master Collection.
Sammy

Old homesite 4.5 has been my choice since 1994.
Aallaire sold it to Adobe.
http://www.ciipuut.co.cc asa

i’m using notepad for all :)
addy

MS Visual Web Developer 2010 Express – or any previous – Edition does the job for me.
http://crackgoogle.com Increase Search Engine Ranking

I just downloaded Notepad++, I am going back to the good old tried and true.

Was excited about Coda until it was 99.00, but they should charge if they work hard to make a good product. I just don’t want to spend 99.00 right now.
http://crackgoogle.com Increase Search Engine Ranking

Firebug that integrates to your server via FTP would be awesome. Does anyone know if there is a way to do that?
http://JustLikeAMagic.com Mohammad Elsheimy

I was searching for the best CSS editor, and by reviewing readers’ comments, I can say that it’s Notepad++.

Thank you very much! :)
http://www.psdstyle.net chuckles

Has any one mentioned Smultron? Nice and clean and easy to use
Die Webwurst

You’ ve forgotten best editor of all: PSPad with implemented TopStyle Lite.
You can develope all from A like Actionscript to X like x86 assembly.

Greetings from Berlin, Webwurst
http://www.franjacoberger.com Fran Jacoberger

I use a combination of HTML Kit, FireBug & Fire Fox Web Developer.

Does anyone know of a CSS editor that will strip the empty lines in a CSS. I have an inherited CSS with WAY too much white space. I could go at it by hand but one accidental erase and I’m better off starting over than looking for it.

Do any of these have such a function? If any one knows on one please post.

Thanks!
- khan256
  
  Notepad++ on sourceforge… TextFX plugin does nearly any text manipulation, including this. (TextFX -> Edit -> Delete Blank Lines (or Delete Surplus Blank Lines)
  - Rupertcs
    
    Homesite will do that. Why doesn’t someone remake allaire homesite it was and still is amazing just needs a few additions xhtml ccs3 html5 php .net and UTF8
http://www.xeoscript.com sujith s

We(Xeoscript Technologies) got another better online CSS Editor “XEO CSS” with lot more

features like.

1.) Styling with zero coding.
2.) Real time preview.
3.) CSS 3 properties like Transition, Transforms, Box and Text shadow, Border radius etc.
4.) Photoshop like Gradients(using css3) with plenty of linear gradient presets.
5.) Includes a Good HTML Editor.
6.) Save your work online.
7.) Multiple HTML files for a single CSS file.
8.) One click CLASS & ID generation from HTML files.

Now check it out: http://www.xeo-css.com

Xeo CSS is a product of xeoscript technologies ( http://www.xeoscript.com ).
http://freshweddingideas.com/ Anny

notepad is the best for any web tools..
- Edegagne
  
  Yeah, if you’re approaching retirement age. I suppose you still use a rotary telephone and don’t believe in cell phones too. :)
  - Old Coot
    
    While I don’t agree about the notepad comment, I also think you are a snot-nose kid who has a whole lot to learn.
    
    You may think those of use who have been around awhile are out of touch. You think wrong. We have forgotten more about IS than you ever knew.
    
    More that that, we CAN use notepad very efficiently. We have written and maintained huge (100,000+ line) programs in editors with less functionality than notepad…and spent less time debugging it than you do using a WYSIWYG development suite. Can you do that?
    
    Oh yea, and our code is much more efficient than what modern tools generate. I mean hey, we grew up making stuff work on computers with less memory than your Ipod.
    
    So blow that snot out of your nose and wipe the back of your ears dry. Make friends with an old developer and you just might learn a thing or two about good coding skills.
    - Asdfasdf
      
      Do you really think, that you can be good programmer with notepad?
      Edegagne did well comparing rotary telephone and phone cells. For example Every tool which has auto-complete function is much more effective tool than notepad.
      Wake up!
      Customer does not pay for you for writing. He/She pays for web pages which work.
      Autocomplete function save my time, which I can use to learn more advanced technology
      - Verena_techie
        
        from another ‘old’ programmer, I can type faster than autocomplete! I’ve used several ‘notepad’ like editors very successfully, coded from command line database cubes etc, yes, we have forgotten more than you will ever know and coded very efficient programs without plugins written for us, we did it all! Now we are doing it still and just as efficiently. No rotary and I have a great data phone that I can SQL program on….
  - Old Coot
    
    While I don’t agree about the notepad comment, I think
    you are a snot-nose kid who has a whole lot to learn.
    
    You may think those of use who have been around awhile are
    out of touch. You think wrong. We have forgotten more about IS than you ever
    knew. More than you ever will know if you don’t smarten up.
    
    More that that, we CAN use notepad very efficiently. We have written and maintained huge (100,000+
    line) programs in editors with less functionality than notepad…and spent less
    time debugging than many do using a development suite. Can you do that?
    
    Oh yea, our code is also much more efficient than what modern
    tools generate. I mean hey, we grew up making
    stuff work on computers with less memory than your Ipod.
    
    So blow that snot out of your nose and wipe the back of your
    ears dry. Make friends with an old
    developer and you just might learn a thing or two about good coding skills.
- http://www.facebook.com/people/Stephen-Dunn/1196540875 Stephen Dunn
  
  People feel the need to say that to give the impression of a super programming god, however it makes you look foolish as nobody on this planet no matter how good at coding they may be could develope a website quicker and as professionally as the best website packages out there using simply notepad, while I’d use notepad for certain things a few tweaks here and there, the idea of making a website using it would be counter productive.So! There for it’s not the best webtool for anything really is it?.
- GingerDan
  
  I just love how notepad highlights the different languages and picks up errors, and, oh wait… Sorry, my mistake.
  - Dann
    
    And therefore Notepad2 exists. Jesus, people.
- tlyoq
  
  For HTML, which is mostly about conceptual organization, I admit you only really need a text editor (though why you’d use notepad instead of notepad++, vim or emacs is beyond me). But real-time display and sliding color/value selection are going to mean a lot for CSS.
- http://www.arafatx.com ArafatX
  
  do u know what year is this?
- mdbobbo
  
  notepad is ok but I use the freeware versioin of NoteTab lite, it’s got more addons than explorer, but still I’m here looking for a WYSISWYG html5 and css editor. how about being nice and accept people humor and get on about talking about what we really want
http://ahnafabid.com Ahnaf

BBedit and espresso is good but they are commercial. but I love Notepad.
http://www.ericmwelch.com Eric W.

TS lite is nice, used it for my class but I’m pretty sure the EULA states the free version (lite) is not for commercial use.
Pingback: 设计者更喜欢什么操作系统 | 数码港
Pingback: 设计者更喜欢什么操作系统 | laura's site
http://twitter.com/gnrsu G.N.R.S.U

like Simple CSS better !!!
Pingback: 设计者更喜欢什么操作系统 | ideaMarket.CN - 关注视觉设计及产品用户体验
Anon

“Cannot import. SimpleCSS does not support @rules”

-Moving onto the next one to try…
Ivan

Hi,

All we at codeanywhere just integrated a full featured online CSS editor, which enables you to edit CSS files in Visual and text mode.

Please do check it out our Online CSS editor @ https://codeanywhere.net/css-editor and let us know what you think.
Cheers
Faagerholm

A complete novice myself, I’ve been getting into web design with Hammerkit’s toolset. It includes an inbuilt CSS editor that has made it very easy for me to understand the whole concept of CSS and how it all links together on a website.
- Lisa Quinton
  
  Can ya put a link in … thanks.
david

the best is http://www.bluepeneditor.com
talwinder

web expression is good ,for live css editing
talwinder

web expression is good ,for live css editing
Darren

do you have to know CSS to use the editors?
http://www.ibuyrealfacebookfans.com buyfacebookfans

I still stick with dreamweaver, but I’m kinda hoping to find a tableless css editor that has the capability to drag and drop elements of css. something like that.
Alex Aslin

I prefer NVU for HTML editing and Notepad for CSS. I feel that it is important to use classic tools to build a website rather than builders and wizards. To me they take all the fun out of making a site.
Andpromobile

owh it’s great.,.

i’ve waited for so long,.
a css editor.,.
Diegomaradona

I try codebloster and how much I love it !! I’am a huge fun
Nasir Uddin

Dreamweaver is the best
http://www.learningquranonline.com/ Learn quran

what about adobe css editor
alpha1000

thanks for the postings … was very helpful … I had stumbled onto a nice public free template … BUT … right smack at the top was this pic of forests … nothing to edit via the usual HTML, even removing the .gif didn’t help … so I knew it was time to go for editing .css …. your site tipped me off that I did not have to buy any of the programs possibly … because I noted that little ‘ol Notepad would actually read those supposedly so complicated .css files …. and so in one of the .css files I found this:

#hdr {
padding-top: 125px;
background: #fff url(headerlogo.gif) no-repeat;
}

and I deleted it, then re-saved the .css file …etc. and on reload … is NO MORE FOREST thingy at the top … everything is nice and smooth … YAY!
http://www.ysapak.com/ Abeera Ali

I like these
Geocrafter Team

http://liveweave.com is great. Simple, elegant and completely online. You can also save & download your file to your computer!
http://www.facebook.com/profile.php?id=1562274467 Gail Ann Fuller

None of them will download and work…

7 Free CSS Editors, Which Is the Best? You Choose.

Simple CSS

TS Webeditor (tswebeditor)

A Style CSS Editor

CSSED – “A GTK-2 CSS Editor”

ELEDO – Eledicss

JustStyle CSS Editor

TopStyle Lite

Subscribe & Follow

RSS in your Inbox

The Best Freebies for Designers (May 2013)

Free Ebooks for Designers and Developers

25 Popular Website Concept Redesigns

Resources For Learning Git

20 Free Flat Icon Sets

The Principles of Typography: Back to Basics

The Best Free Responsive Sliders Plugins for WordPress

30 Innovative and Creative HTML5 Sites

“To Mobile App” or “Not To Mobile App”

The Thrifty Freelancer – Design Tools on a Budget

Our iOS App by Mobiloud