A dark code view theme for Dreamweaver

I don’t know about you, but sometimes I tire of looking at a bright white code view all the time. Dreamweaver has a great coding environment but the default colour scheme isn’t always suitable, especially when your coding in the dark.

Luckily you can change the default code view colour scheme, although it’s a bit time consuming and there is a lot of trial and error. But if you’re feeling particularly lazy, and you like the look of the theme I have happening in the screenshot below, then you’re in luck.

dreamweaver dark code theme

I tailored this theme a few weeks ago and today I realised I have no intention of going back, so I’ve now transferred it to my laptop and office work station.

Follow the instructions below (only tested on Dreamweaver CS3 onwareds) if you’d like to take it for a test drive. You can revert back to the original theme if you don’t like it.

Note: The instructions below make reference to Dreamweaver CS6, so obviously you’ll need to substitute for whatever version you are running.

Instructions for Windows

You’re done. Open a file and switch to code view to see the new colour scheme. Combine this with a good programming font and things get even better.

I don’t like it! Put it back!

Changed your mind? No problem. Just close Dreamweaver, delete the Colors.xml file and then rename Colors2.xml back to Colors.xml. Oh and don’t forget to change the default background colour to #FFFFFF in the preferences (ala point 5).

Update 01: @todayinart has confirmed this also works for Dreamweaver CS4 on the Mac with the path being slightly different. See his comment below. Cheers for that matey.

Update 02: I can confirm this also works on Dreamweaver CS5.

Update June 2012: Many people commenting below have confirmed this works on CS6. Thanks for that!

Update May 2013: Nathaniel at Tutvid has put together a great video tutorial. Check it out below.

Update September 2013: I can confirm this works with CS6 on Windows 8.

httpv://www.youtube.com/watch?v=gYEg1q6-okM

dreamweaver_colours.zip (3k)

Who is That Web Guy?

Michael is a veteran web designer / developer / usability evangelist, practitioner of W3C guidelines, occasional judge for the Australian Web Awards (2011, 2012, 2013 & 2014) and creator of Task Rocket.

  • Carerra Davis

    Worked like a charm. Is there a way to make the dreamweaver interface a darker theme?

  • That Web Guy

    I’ve had a look around before and didn’t find a way to skin the actual interface components. That would be pretty cool.

  • Beth

    Didn’t work for me

  • Beth

    Ignore me I forgot part 5 – now looks fine. I can get used to this.

  • That Web Guy

    Glad you like it.

  • CSS Babe

    That’s so much nicer.

  • @todayinart

    Worked great on a Mac 10.5 w/ CS4, but here are some specifics for those peeps to keep in mind. On the Mac there are 2 places that have the colors.xml. One is for global use and one is for the user. Go to:

    %machineName%\Users\%username%\Library\Application Support\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring\Colors.xml

    Do everything else as listed above. I did have to restart my machine to get it to work though.

    Thanks for the Color Scheme. Saved me loads of time!

  • That Web Guy

    No sir, thank you! I’ve updated the article at the end with a link to your comment about CS4 on Mac.

  • Caidyn

    Works great!

  • Adrian Harding

    Hey, just stumbled on this post from Google. Love the colour scheme, much easier on the eyes :).

    I’m on a Mac and didn’t require a reboot by the way.

  • kHa

    i’ve been using black screen since it was really black (or blue). i always take my time and change defaults of every editor i used before.

    but i like your pastel colors very much.

    guy, you made me changed my own scheme to yours. i give you that…

  • Hayden

    Love it! just what I was looking for. THANKS!

  • Chris B.

    Thank you for this, I was editing my file and saw I had to do the PHP coloring by hand and gave up. It is so much easier for me to read now.

  • kHa

    guyz, i forget to write but correct file location for Vista sould be like following:

    C:\Users\%username%\AppData\Roaming\Adobe\Dreamweaver 9\Configuration\CodeColoring

    have a nice day

  • Tom
  • Tom

    I made my dark code colorization for Dreamweaver. You can download it here http://www.sramekdesign.com/dreamweaver/dark-coding-colorization-for-dreamweaver/

  • wee

    works for me on dreamweaver 8, however do you know how to tweak the color of the highlight selection ? currently its on gray.

  • Harun Smrkovic

    Can I change font in code view ?

  • That Web Guy

    Yes you can. Preferences -> Fonts -> Code View

    Choosing something suitable can be tricky.

  • Harun Smrkovic

    Mikey, have You ever used Zend Studio Eclipse ?

    I love that app, but font there is even more ugly than one in Dreamweaver, and I can’t seem to find a way how to fix it.. Do you ? :D :D

  • That Web Guy

    I’ve used it and I reckon it’s the best of the free web dev apps out there. From memory I know you can change the theme but I’m not sure about the fonts.

    I started an article a little while back on alternative code fonts and might even publish it soon.

  • Harmony

    Another great article from you! (found via your latest blog post on Dreamweaver code-view fonts). Thanks as always for sharing these useful tidbits and tools, they’re much appreciated.

    Btw the site design and usability on this site is just lovely, and the code captcha makes me smile :)

    Harmony

    http://www.harmonysteel.com

    http://www.alarinmusic.com

  • That Web Guy

    Thanks a bunch for the kind words Harmony. I think you and I will get along famously :-)

  • Randy

    Thanks a bunch man, saved me an hour of trail/error : ) and for your captcha, what if i didnt know who elvis was? I was born in 84! You need a picture of tupac or ex president bush

  • Anna

    Tested for CS4 on a PC (XP) – it *works* in the sense that new colors are applied but they are not the same as what is shown in the screen shot in the post. Most everything is a different shade of blue. The path is different also:

    C:\Program Files\Adobe\Adobe Dreamweaver CS4\configuration\CodeColoring

    Didn’t require a reboot.

    Maybe this is the global and I need to change user settings too? Haven’t had time to play around with it yet but definitely better than the default, with some tweaking. Thanks :)

  • That Web Guy

    Thanks Anna. If you get it sorted be sure to post your results here. Enquiring minds want to know :-)

  • dthomas

    I had an issue with WinXP Dreamweaver CS4 that required me to delete the applications cache file but other than that works great.

    Thanks!

  • diogo

    for dreamweaver cs4 and windows 7:

    this post from dreamweaver help file:

    “From David Powers (moderator):

    Mark, the colours are saved in a file called Colors.xml in the CodeColoring subfolder of each user’s personal configuration folder. (…) For Dreamweaver CS4, it’s as follows:

    Windows 7: C:\Users\\AppData\Roaming\Adobe\Dreamweaver

    CS4\\Configuration\CodeColoring

    A very crude way of reverting to the standard colours is to delete your personal configuration folder. Dreamweaver then automatically creates a new one with all the default settings when the program is next launched. However, this deletes any other preferences you might have set. A less destructive approach is to rename your personal configuration folder temporarily, and relaunch Dreamweaver. You can then copy the new version of Colors.xml to your renamed configuration folder, delete the newly created one, and change the name of your backup to Configuration.”

    I deleted all the files in the CodeColoring folder and pasted the colors.xml from this site. Restarted Dreamweaver, and voilá…

  • Onur

    I could not use this for my Macromedia Dreamweaver 8 :) do you have any fixes for this?

  • That Web Guy

    None that I’m aware of sorry. Maybe someone else has an idea?

  • Toon

    I have DW8, and it worked just fine. You have to overwrite (make a backup though) the file in this directory: ” C:\Documents and Settings\%UserName%\Application Data\Macromedia\Dreamweaver 8\Configuration\CodeColoring\Colors.xml”

    good luck

  • haldun boz

    thanks it was awsome!! :)

  • franky b

    How about ASP VBScript?

    any support for that?

  • That Web Guy

    Sorry Franky, I never took it that far as I don’t venture into that territory.

  • ScottFoley

    Wow…what a difference. I immediately noticed my eyes relax. I bet this will help with eye strain. Thank you!

  • That Web Guy

    Anytime!

  • bigpapa

    thank you bro!

  • Ricardo Zea

    I tried it on Dreamweaver CS4 in WinXP, but I had to place the ‘Colors.xml’ in two places for it to work for me:

    1. C:\Documents and Settings\%user%\Application Data\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring\

    and

    2. C:\Program Files\Adobe\Adobe Dreamweaver CS4\configuration\CodeColoring\



    Also, as an FYI, the color scheme from http://www.sramekdesign.com/dreamweaver/dark-coding-colorization-for-dreamweaver/ and this one here are exactly the same. Both files weigh “14.3 KB (14,680 bytes)”.

    I also decided to use a darker background: #191919.



    There should be an Extension for Color Coding Themes for Dreamweaver.

    Thanks a lot for the info Mr. WebGuy, extremely helpful.

  • Fred

    DW8 + your theme + DIV tags= nearly invisible!

    Do you know what DW8 refers to DIV tags as please? They come out as a dark blue, which nearly matches the hues of the dark backgrounds making them hard to see.

    I can’t seem to find DIV tags in the colour preferences, and it’s driving me bonkers..

    Thanks for the theme though, now DW looks nearly as good as Komodo Edit 5!

  • Bryan

    very nice thanks! darker is better :)

  • IkeaTheSofa

    Thanks for your comment Diogo. I’d been screwing around trying to get this work right on Vista 64 and though I follow the instructions above, could not get it right.

    I then tried what you suggested, deleted everything in code color folder (under user appdata) and pasted colors.xml and BAM! Kicked it up a notch.

    IkeaTheSofa

  • Koen Schmeets

    I’m also using it at home and at work now,

    It’s just awsome!

  • Caleb Kester

    I have to say, i’ve used this twice now (once pre-7 now on 7 with CS3) and I have to say this is an extremely good theme. I normally don’t post comments on stuff but props to you, it’s awesome!

    Note, I did make one change for text files, currently the background and font are really close to the same, I just changed the font color to be: #0099FF

  • That Web Guy

    Thanks for the compliment and I’m glad you liked it. Light blue for the font hey?

  • Jesus Estrada

    Great job! I like how it seems and it’s better for my eyes, the #FFF color in the background sometimes makes me get tired

  • That Web Guy

    Cool. If I could suggest combining this theme with Droid Sans or one of these other fonts and you’re all set. Droid Sans is an awesome code font: http://www.thatwebguyblog.com/post/5_good_programming_fonts

  • Roman

    Спасибо за тёмные цвета, а то самаому как-то впадло их было подбирать!

  • Jason

    Thank you! This is a very nice theme. I get very tired of looking at white with sharp colors. This theme is quite relaxing. Thank you!

  • Erkan RUA

    Bad color don’t install.Default very beatiful

  • Phil

    Thanks a lot, i did get some Javascript errors at some point. Removed it and reinstalled it. I’ll let u know if it pops up again. It works perfectly on my pc at home (Win7)

  • That Web Guy

    Awesomeness. That’s the same platform I use with Dreamweaver CS3. Not sure why you got JS errors though. At least it’s working now.

  • Nillerz

    I am using Dreamweaver CS4, and it appears to be working! I have tested it with PHP, CSS, and HTML pages.

  • Pablo Bustamante

    Hi! Kudos on the great work!

    Have you ever think about porting Monokai to Dreamweaver? That would be AWESOME!

  • Jeff Lyon

    Hi, this is pretty much a life saver. Or at least an eye saver. Great work and thanks!

  • Laneth Sffarlenn

    Just wanted to pass on my thanks for serving this up here – it is, as Jeff above me said, a life / eye saver. Your colours are much more complimentary to the hit-and-miss theme I’d created for myself :P

  • That Web Guy

    Thanks Laneth – glad you liked the theme.

  • Dave Naves

    thanks much for posting… worked like a charm. much easier on the eyes and i didn’t have to spend an hour doing it. (only about 2.5 minutes)

    shared it on twitter for your efforts… payin it forward.

    =)

    cheers,

    //dave

  • That Web Guy

    Thanks Dave. You da man.

  • Chris

    Hey I’ve been using this for quite awhile with CS3 and just recently upgraded to CS4… The proper path for CS4 on Vista is as follows:

    C:\Users\[username]\AppData\Roaming\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring

    Thanks for the great color scheme!

  • don-wp

    everything go in right way in cs4. tnx dude ;)

  • khaleel

    @diogo

    Thanks for the Windows 7 tips. I did your suggestions and it worked! Windows 7 64bit – I moved all the current color.xml files like asp xml to a backup folder and placed the new color file in there on its own!!

    works great!!

  • Amit T

    Nice, just what I was looking for, works perfect with CS3.

    Thanks!! :)

  • That Web Guy

    Awesome 2 the m@x. I’m glad so many people are finding this useful.

  • Christopher B

    Thanks for this. I have also explored this option: http://www.sramekdesign.com/dreamweaver/dark-coding-colorization-for-dreamweaver/ In both however the colors are quite vibrant and crayola rather than rich and a bit more subdued as are the ones I’ve seen by great designers for Coda and especially Espresso.

    My biggest dislike is also with the default font. With all my other editors I can change the font, is this not possible with DW? Also with my other editors that use CSS to style the colors, I can set the background to be transparent, is that not possible with DW? If not are either of those options possible with DW5?

  • That Web Guy

    Hi Christopher.

    You can change the font in Dreamweaver: http://www.thatwebguyblog.com/post/5_good_programming_fonts

    I’m pretty certain there is no transparency support though. I wouldn’t use it anyway – I like my code to be totally legible while I’m working on it.

  • Jason

    very cool, thx!

  • Ronovator

    Hey, hope you don’t mind but I needed to use manually create the theme in my editor so i ripped the color codes from the image. You can find it here http://i42.tinypic.com/14lotu1.jpg

    This should save others some time and effort if they need to get the exact colors.

  • Tiffany

    SWEEEEET!!!! Wondering though if you have a download for the original/default “Colors.xml”???…..seeing as how I started changing colors all willy-nilly before I found your site and before I realized there wasn’t a “Restore Default” button to click in Dreamweaver.

  • That Web Guy

    Here you go – the original colors xml file just for you: http://www.thatwebguyblog.com/wp-content/uploads/2011/12/colors.zip

  • Tiffany

    Yaaaaay!!! Thank you so much! Really appreciate it! Now my inner control-freak/OCD can be subdued.

  • Evie

    Thanks dude. I have always preferred a darker bg while coding but they make it so hard to do it all at once (seems they’d have some built in schemes you know? C++ Builder did and that was 15 years ago!).

    Much love!

  • Edd

    Works on Dreamweaver CS5 on my Mac too. Cheers.

  • CaveMaster

    Love the colors you set up, and use it on all my computers. One thing i had to do manually though was change the default code background color, but no big deal to do that.

    Thanks!

  • DW

    Thanks for the color scheme. Looks great. Using it on a MacBook Pro with DW CS5. I did have to close and open DW a couple of times to make the changes take effect. Wish there was a place where you could download a bunch of great color schemes. Thanks again, not only for the color scheme but the great instructions and explaining how it works.

  • That Web Guy

    Awesomeness – good to see this theme is getting plenty of use. Feel free to spread the love.

  • That Web Guy

    Think nothing of it.

  • WhiteDog

    Unfortunately, I find that with your replacement Colors.xml file I lose the ability to change any but the background color in the Dreamweaver CS4 preferences. I opened the file with BBEdit, but the item names don’t always correspond to the names in the Code Color preferences. I guess I’ll have to spend some time experimenting – unless you have a list of equivalent names I could use. Anyway, thanks to turning me on to using an alternate background color. By the way, when I type in the background color value you recommend, I get an error message saying it’s not a valid hex value. So I chose the nearest dark gray in the color chart. By the way, I’m working on a Mac, if that makes any difference.

  • That Web Guy

    Sorry it didn’t work out for you. You’re the first in this comment thread to report any problems. I only used CS3 on Windows but some brave adventurers tried it on CS4 and the Mac and all report these instructions work for that as well. The best I can offer is the default colours.xml file back if you didn’t already keep a copy.

    http://www.thatwebguyblog.com/wp-content/uploads/2011/12/colors.zip

  • Todd

    Love it, this is almost the exact same color scheme I use with Textmate. But sometimes I still like to use Dreamweaver for html/css work so this should help keep things consistent.

  • Gerard

    Great!! I’ve looking for this for a while..

    Thanks!

  • Victor

    Охуенно! =awesome! Thanks a lot

  • ico

    Hey thanks this the right way for CS4 for Windows 7

  • Kelicia

    THANK YOU! I’ve always spent about 30min configuring colors each time i use DW on a new machine but this cuts that out! So much faster and is working beautifully on Win7-CS5.

  • Big S

    i’ve been using your colors for a while now and it’s been making my job a whole lot easier. the scheme i was using before this one, was made by me and must admit yours just looks more.. right. all this being said, i wanna thank you and well.. looking forward to checking your DW CS5: HTML5/CSS3 scheme (if, of course, there will be one). peace

    Adobe Dreamweaver CS5 HTML5 Pack:

    http://labs.adobe.com/technologies/html5pack/

  • Guest

    Thank You for your effort to make this avail, looks great and easy on the eyes, keep up the great work

  • asdasd

    you rock!

  • Chris Mapes

    I FINALLY FOUND A FIX FOR THOSE WITH WINDOWS VISTA/7 DREAMWEAVER CS4 (maybe CS5 too)

    I spent a half hour trying to figure out why it was not working. The key is to make sure you remove the original Colors.XML file from the C:\Users\*YOUR USERNAME*\AppData\Roaming\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring folder.

    I backed up the original file by renaming it and leaving it in the same directory as the new one. The sneaky part is that Dreamweaver will parse ALL of the .xml files in the folder, so if you don’t move it somewhere else (like the parent folder), it will parse it and undo the changes that the new colors.xml file applied to your color scheme.

    So if it isn’t working for you, make sure to remove the original from the folder, then start up Dreamweaver and see if it works.

  • Srikanth AD

    Wow, the color scheme looks great. Thanks.

  • That Web Guy

    Thanks Srikanth. Glad you approve.

  • melissa

    HI I WAS READING YOUR REVIEW ON RUSTY LIME ABOUT THE VIEWSONIC MONITOR I TOO HAVE THE SAME MONITOR RUNNING WITH VISTA BUT as FAR AS THE RESOLUTION I CANT SEEM TO FIND THE RIGHT FORCEWARE DRIVER YOU WERE TALKING ABOUT ON http://www.guru3d.com/ I INSTALLED ONE AND IT SAID IT WASNT COMPATABLE OR SOMETHING LIKE THAT. ANYHOW I WAS WONDERING IF YOU STILL REMEMBER THE NAME OF THE EXACT ONE YOU USED THAT WORKED

  • David

    Yes Anna,

    You changed the default settings for Dreamweaver. The correct path for the location of YOUR config settings is something like:

    C:\Users\(username)\AppData\Roaming\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring

    It might be slightly different depending on your OS, and remember that the AppData folder is hidden.

  • George

    Nice one, cheers dude!

  • That Web Guy

    Anytime!

  • khanh

    I like this scheme color. Thanks so much!

  • Thomas108

    Hi, thanks for your dark code view theme

    Do you maybe know if there is a possibilty to change the colors individually for brace ( and curly brace { in javascript?

    I would like to give them each a different color.

    The only place I found in CS4 on line 53 is this for all types of brace or brackets:

    Any idea?

  • That Web Guy

    You certainly can. Go to Preferences -> Code Coloring and select a document type. Click ‘Edit Coloring Scheme’ and scroll down to ‘JavaScript Bracket’. You can replace the colour there.

  • alfredo

    thank you!

  • Brecht

    You just saved me countless hours.

  • Steve Barakat

    Thanks Michael. You chose some great colors for coding and saved me a lot of trial and error. I too was tired of the usual code editing color schemes and find this one to be soothing on the eyes and aesthetically pleasing.

  • Jeffrey Nichols

    Awesome! I used to spend so much time doing this each time I moved to a new computer. Thanks!

  • Mat

    This is so much nicer than having my eyes fall out bright white screen with bold colored tags. Thanks for posting this!

  • BMS

    Really liking this..i get bored of the default…although it will take a little getting used to…i think this will be easier to read in the longrun….perfect!

  • Tahir Azhar

    Thanks. Excellent work.

    Now if someone can write a visual studio theme to dreamweaver theme convertor for studiostyl.es

  • That Web Guy

    No problemo. Though I don’t think I’ll be working on a Visual Studio version any time soon :-)

  • bms

    this was awesome…but i couldnt get the colors to change on asp pages…its yucky looking in cs4 on windows. not sure what to do i did a find and replace for anything that was black and replaced it with white in the xml file and still no dice…other changes work though…weird eh?

  • Iván T.

    Here’s a link to a .rar file that contains the ‘ColoringCode’ folder for Dreamweaver CS4 & CS5. Instructions included on file comments.

    http://letitbit.net/download/04463.0e551f572ceca17ea80f6828857d/Dreamweaver-ColoringCode-folder-CS4-CS5.rar.html

  • knoxautoguy

    This is great! I’ve spent waaaaay too much time trying to get the code coloring to look right, but this will work fantastically with very little thinking on my part. Thank you Web Guy!

  • Adam

    Oh man! I thank you kindly for this theme modification!

    Quite perfect!

  • That Web Guy

    @knoxautoguy @Adam

    Cheers for the feedback.

  • Sean Langlands

    This is great, I’ll try this out and see if it helps my eyes!

  • Brent Blaskievich

    Updated the xml with ASP VB.

    http://visualplastik.com/stuff/Colors.xml

    Pretty easy to just copy paste FYI.

  • 2digital

    Thanks,

    I had a dark color scheme for one of my other coding programs, this one is similar

  • dan

    Thank You!

    FYI: This is the path I had to use in Vista

    C:\Users\**username**\AppData\Roaming\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring

  • ldexterldesign

    Cheers, this solved my only problem in Windows 7, DW CS4. Cheers for your work Mike. The guy’s comment above needs to be mentioned in your original post (would have saved me 15mins).

    Best regards,

  • That Web Guy

    Thanks ldexterldesign.

    I’ve amended the article to include the path for Windows 7. Something I probably should have done a while ago :-)

  • pak

    another thank you for this.

  • Lazy Coder

    Works well in CS5… Thanks a bunch…

  • ben

    you should extend it for .asp files, it’s not readable at all :/

  • jacob

    got only two words – very sexy.

  • Kevin

    Here is the path in Mac OSX:

    username/Library/Application Support/Adobe/Dreamweaver CSx/en_US/Configuration/CodeColoring/Colors.xml

    Thanks again!

  • Hassan Raza

    Just did it. Hopefully i will be use to it. Thanks Mikey.

  • Anil

    Thanks for posting the theme. I installed it on my iMac running CS4 and for a while I thought all was good. However I came across something strange happening on my machine. When I create an XHTML 1.0 Strict file, the syntax coloring is incorrect, but if I create an XHTML 1.0 Transitional Document it’s ok.

    Here is the kicker. If I take the contents of the newly created XHTML Strict doc, and paste them into a newly created XHTML Transitional doc the coloring is fine.

    I don’t know if this is an issue with the coloring scheme as it is with Dreamweaver, but just thought I would point it out to you.

  • Anil

    So I narrowed down the page types that this is occurring with.

    It happens if you select ColdFusion, JSP, or any of the ASP Page Types.

  • Anil

    Line 224 of the Colors.xml file you have this line:

    bgcolor=”#F8DOAF”

    which needs to be corrected so that the “O” is a “0”

  • Gary

    Hi,

    Thanks for this. Ive just used your xml file and most of your pc instructions to do the same on a Mac using DMWVR CS4. Worked like a charm and my eyes thank you for it.

    Cheers

    G

  • That Web Guy

    No probs Gary. There are a few comments here supporting Dreamweaver on Mac. If I a Mac I’d post something concrete but it turns out most people are smart enough to figure it out anyway.

  • Jan

    Hey, cool Theme!

    But: can anyone please give me the original colors.xml file? I deleted mine…. :)

    thx, Jan

  • That Web Guy
  • That Web Guy
  • Jan

    thx!

  • Jose

    Yup this did the trick on Win7

  • ibrahim

    thank you very much :)

  • Mike

    I love this but the code highlight color is a dark blue that hardly shows up. How can I make that a different color? I can’t find an option.

  • Addask

    Thx u very much

  • Josh

    Also works on CS5.5 on Mac OS 10.6.8

  • Ryan

    Confirmed for working in CS5.5 also.

  • John W

    Thanks so much for this!!!

  • Jack McCourt

    This is the only way to code xD, the standard white background plays with your eyes after a full day of development but this is a must have.

    Thank you to whoever thought up this simple but brilliant idea.

  • hanson

    don’t work for me in lion and cs5.5,please help me.

  • Jonas

    Good job. Thanks for your help. Now its much relaxing :-)

    And to undo it’s very fast just by taking back the old color.xml.

    Reminds me the real programmers :-D

    Loving this.

  • Simon R

    This doesn’t appear to work for CS5.5, but it does for 4. It’s a very nice theme. Just wished it worked with CS5.5

  • That Web Guy

    Hi Simon R,

    It works just fine for CS5. I’m using it now in fact. In Windows 7 navigate to:

    C:\Users\%username%\Application Data\Adobe\Dreamweaver CS5\en_US\Configuration\CodeColoring

    Look for a similar directory structure if you’re using a different OS. It shouldn’t be too difficult to work out.

  • Simon R

    Ahh, yes that works. Thanks :)

  • Kyle S

    Love it, thank you! I went into the XML file and changed all instances of #252A32 to #000 (because I prefer black as a background instead of the “Hawaiian Poi Purple”). Hopefully it won’t cause any issues.

  • d21anthony

    I know I’m going to sound like a beggar but I grown so attached to your theme that im going crazy lately. I just switched to Netbeans and found a couple of similar themes but none as awesome as yours. If you ever get a chance to create one for Netbeans that would be fantastic! Thanks again.

  • sid

    A very worm thank you! The colors are very ‘preaceful’ to the eye.

  • Si

    Hello there,

    Really like this theme, thanks for sharing.

    I’m having problems with the theme being picked up when editing .less files. Any idea how to get this working?

    I have edited the /Applications/Adobe Dreamweaver CS5/Configuration/DocumentTypes/MMDocumentTypes.xml adding .less to macfileextension but to no avail. Any help would be appreciated.

    Can I add less to the Colors.xml – like say copy over the CSS definitions?

    Thanks again

  • Si

    Ok, figured this out. I just needed to also add the less extension to

    user/Library/Application Support/Adobe/Dreamweaver/CS5/en_US/Configuration/DocumentTypes/MMDocumentTypes.xml

    I added ‘macfileextension=”css,less”‘ and whoopee it worked. Thanks again for the theme :)

  • raghav

    hey,

    if u cant see the /appdata try turning on the show hidden folders in the control panel

    cheeeers

  • phelix

    I have no idea what the hell is wrong with my Dreamweaver but its NOT reading this new file. I have even deleted the old one out of the directory. I can restart Dreamweaver all day long but it WILL NOT read the infos from Colors.xml. What am I doing wrong? I even found where this file was located in the Program Files and added it there too and no matter how many times I restart its got the old color scheme in there. What must I do to get Dreamweaver to reload this xml file? I have CS5 with Windows 7 Someone please help me figure out how to get Dreamweaver to read this new file.

  • phelix

    I have removed this file completly. AND deleted it and rebooted. Dreamweaver WILL NOT change the colors according to whats in Colors.xml Is there a way to flush this cache or something?? This is driviing me nuts! DW will not update my colors at all =(

  • phelix

    Ok, I was able to figure this out. I am surprised that know one else ran into an issue with this. I had 5 or 6 different files in this folder. I guess it will over write the colors.xml file. Once I deleted all the other files in this folder and had ONLY colors.xml it updated perfectly.

  • That Web Guy

    Glad it worked out for you phelix!

  • iorbita

    …eccellente! Grazie ;o)

  • iorbita

    Hi,

    … color doesn’t work for .xsl documents?

  • http://thatwebguyblog.com That Web Guy

    @iorbita I’ll be working on an improved version of this soon, which includes among other things xml and xsl colouring.

  • Darren

    FYI – The download file returns a 404 with this new design.

  • http://thatwebguyblog.com That Web Guy

    @Darren

    Oops! All sorted mate.

  • http://darrencooney.com Darren

    Cheers, Love this theme.

    -d

  • http://desyna.com Neo

    Thanks, you’ve restored my faith in Dreamweaver

  • T Jupp

    I put this off for way too long. My code-color scheme was all messed up from changing the settings over the years.

    Thanks for the color-scheme instructions – quick and easy!

    ***WORKS ON CS4, VISTA 32*** config filed under: User\AppData\…

  • cs6

    how about the latest creative suite 6 release ?

  • Bryant

    Works great!

    CS6 on Mac :)

  • http://www.shanejones.co.uk Shane Jones

    Works on CS6 on Windows 7

  • http://ideas4promos.com Kurt Gibbs

    Thanks for the insight to where and what files define Dreamweaver’s code coloring. With this, I discovered how to make all HTML attributes (class, id, href, src, name, width, height, etc.) a common color that is distinct from all other HTML tags, etc. I’ve been wanting this in Dreamweaver for a long time. I can’t figure why this option has remained hidden when it’s so common with other code editors.

    Define Dreamweaver CS3 HTML attributes as a distinct color:

    File: CodeColoring.xml
    Code Location:
    New Code:

    File: Colors.xml
    Code Location:
    New Code:

    Now your DIV’s, UL’s, TABLES, etc. are distinct from ID’s, CLASS, etc.

  • http://ideas4promos.com Kurt Gibbs

    Thanks for the insight to where and what files define Dreamweaver’s code coloring. With this, I discovered how to make all HTML attributes (class, id, href, src, name, width, height, etc.) a common color that is distinct from all other HTML tags, etc. I’ve been wanting this in Dreamweaver for a long time. I can’t figure why this option has remained hidden when it’s so common with other code editors.

    Define Dreamweaver CS3 HTML attributes as a distinct color:

    File: CodeColoring.xml
    Code Location:
    New Code:

    File: Colors.xml
    Code Location:
    New Code:

    Now your DIV’s, UL’s, TABLES, etc. are distinct from ID’s, CLASS, etc.

  • http://ideas4promos.com Kurt Gibbs

    Sorry, I tried to add the code but it’s being removed!

  • http://thedeafkid.com Pat

    this works on cs6 dw6

  • RkaneKnight

    Version 11.5 Build 5366 update seems to have screwed up the coloring.
    The blues and reds are really bright, and the contrast is making it harder to read.

    I’m going back to my old colors and then try and load again and see if it fixes it, I’ll report back.

  • RkaneKnight

    Dunno what was wrong, but after I replaced the CodeColoring folder with the original inside the Dreamweaver Applications folder then I was able to replace the Colors.xml file and it worked great.

    Thanks again for what you’ve produce here, and how you’ve increased the life expectancy of my eyeballs. Now if you’d just make your webpage black too. :)

  • http://thatwebguyblog.com That Web Guy

    Glad to hear it’s working out so well for everyone, and props for the CS6 confirmation from you guys.

  • Ryan

    How did you get it to work on CS6 Mac? I cannot get it to work

  • Ryan

    P.S. Is this your tumblr? Look like the same exact text and coloring… http://listik83.tumblr.com/post/1657441852/a-dark-code-view-theme-for-dreamweaver-cs5

  • http://thatwebguyblog.com That Web Guy

    @Ryan

    Hey mate – that’s not my tumbler, but thanks for the heads up.

  • http://www.lucapuggioni.it Luca

    Not work on dw cs6 on mac.. can you help me ? i put Colors.xml on CodeColoring folder
    Thank you

  • LoreZyra

    You can also build your own Dreamweaver “theme” and download the Colors.xml file from this site:

    http://www.highonphp.com/dw/

  • http://ajwebdesigner.in Steel

    MAC USERS
    For Adobe Dreamweaer CS5.5 or CS6

    /Applications/Adobe Dreamweaver CS5.5/Configuration/CodeColoring

  • http://www.mustafayalcin.net.tr mustafa

    Have you supported coloring for asp language?

  • http://thatwebguyblog.com That Web Guy

    @mustafa

    Sorry matey, I’ve no plans for that. You’re free to edit the xml file yourself if you’re keen.

  • harold

    sweet! thx, this came in handy. Now I look pro! lol

  • http://iraul.com Raul

    cant see to make it work in cs6 for mac. Any one please guide me. thanks

  • http://nioute.co.uk nioute

    For me on OSX + CS6 this didn’t work:
    Applications/Adobe Dreamweaver CS6/Configuration/CodeColoring

    This did:
    /Users/nioute/Library/Application Support/Adobe/Dreamweaver CS6/en_US/Configuration/CodeColoring/

    Don’t forget in (Dreamweaver -> Preferences -> Code Coloring) change the Default Background to: #003

    Finally, great coding font is Adobe Source Code Pro. Grab it here:
    http://blogs.adobe.com/typblography/2012/09/source-code-pro.html

    All works dandy, thanks WebGuy.

  • Dennis

    Thank You Sir,
    I know what a pain this is to do.
    I spent much time trying to make color adjustments too accommodate my vision issues (cataracts reforming on my surgically replaced lenses – yes it’s possible!).
    Your scheme is spot on for me! Now I can go much longer sans laser treatments.
    Your efforts are greatly appreciated…

  • Dennis

    P.S.

    I’m glad I’m not color-blind too!

  • ixiel

    thanks.. this method still worked in cs6 and windows 8.

  • http://thatwebguyblog.com That Web Guy

    @ixiel Thanks. I’ve just installed Windows 8 as well and am about to try this.

  • http://www.mai68reloaded.com Benjamin

    Hi guys

    I use Windows 7 and Dreamweaver CS5, and it didn’t work, while I really did again and again all what is said here. :-(

    Someone has an idea?

  • http://thatwebguyblog.com That Web Guy

    Hi Benjamin,

    It does indeed work even on Windows 8 with CS5. Did you restart Dreamweaver?

  • http://tomanow.com Tomanow

    Just wanted to say THANK YOU! This theme is great!

    I can confirm it works on windows 8 with Dreamweaver CS6

  • TLM_Code@Gist

    So much better on the eyes. Now I can make custom ones.
    Would be nice if there were a configuration repo somewhere.
    I guess google is my friend ;)

    Thanks again.

  • Wilson Tamarozzi

    Nice Theme (BR)

  • Max

    First of all, thanks for making this dark theme publicly available. I honestly don’t know why Adobe doesn’t include predefined themes for Dw. That and many other reasons is why I still prefer Notepad++

    Anyways, I’ve installed this on Dw CS6 and it works fine, nevertheless, there are small changes I want to do, like make some values BOLD and other small changes. The problem is that for some reason these changes are not saved. I’m making these changes directly from the Dw code coloring interface.

    Any idea as to why this is happening?

    Thanks

  • http://thatwebguyblog.com That Web Guy

    Hi Max,

    I can’t think of why that’s not working for you. Are you restarting Dreamweaver after making the changes?

  • Max

    Yes, I have. I really don’t know what the problem is.

    Anyways, by any chance, do you have the XML for the theme displayed on the top right hand side of this page then, one with this background color #242524

  • Mary

    Is it possible to have Monokai theme in Dreamweaver CS6 ?

  • http://thatwebguyblog.com That Web Guy

    Hi Mary,

    I’ve no plans to do another theme but Dreamweaver has it’s own built-in theme editor: Edit -> Preferences -> Code Colouring and then double click for the language you want to edit.

    The Monokai hash values can be found here for reference: http://eclipsecolorthemes.org/?view=theme&id=52

  • http://alexcory.com/alexcory Alex

    I was having trouble with the color of my text. I’m new to everything and am still learning but for example the title is black and so there is very little distinction between the text and the background. How do I adjust the font color?

  • http://thatwebguyblog.com That Web Guy

    Hi Alex,

    I’m not sure what you mean by ‘the title’. If the result doesn’t look like the picture in the article then something is wrong. You can change the font colour in Edit -> Preferences -> Code Colouring and then double click for the language you want to edit.

    Also remember this is for code view only, not WYSWYG view.

  • http://www.splinterteal.com/freelance-web-designer baily

    It does not work in the latest Creative Cloud release – Dreamweaver CC

  • http://thatwebguyblog.com That Web Guy

    @baily

    Yeah that was bound to happen. I suspected CC would have a totally different directory structure compared to previous versions.
    We will be getting CC at the office very soon, and when we do I’ll work out how to do it and add instructions here.

    Hopefully there is still a way because honestly I can never go back to white!

  • http://www.inline.se Roine Öberg

    Tried it on Dreamweaver CC and it still works. Just need to change default background to #020630

    Thanks for this tutorial

  • http://thatwebguyblog.com That Web Guy

    Thatnks @Roine Öberg!

  • cp

    Thanks Michael – works like a charm!

  • http://thatwebguyblog.com That Web Guy

    Thanks control panel!

  • Matthew Ehring

    Directory for Dreamweaver CC is

    C:\Users\%username%\AppData\Roaming\Adobe\Dreamweaver CC\en_US\Configuration\CodeColoring

    Work’s great and I like all of the text colors. Only color I changed is background to pure black. Had to do find / replace in the .xml file to replace #000033 with #000000. Just personal preference =)

    Thanks for this!

  • dbzvin

    I have Dreamweaver CC on a Mac. I change Colors.xml in

    /Applications/Adobe Dreamweaver CC/Configuration/CodeColoring

    This doesn’t work. I haven’t tried it on a PC but this just continues to be a struggle.

  • http://grayda.smugmug.com Grayda

    Exactly what I needed. Now I can code without squinting like I’m staring directly at the sun!

  • http://www.fallingbrick.co.uk/ Web Designer

    Unfortunately it doesn’t work in the latest CC version.

  • http://imperial-realms.com Roger Antonio

    For Mac users who can’t get this to work :

    In Finder press “Go” on the top of your screen.
    Press and Hold your Option Key (alt)
    You’ll see “Library” appear.
    Click that and it will go to your Library
    Then go to Application Support > Adobe > Dreaweaver (version) > en_US > Configuration > CodeColoring
    and there you will find the correct “colors.xml”

    good luck ;)

  • http://bloggingzine.com/ Hendra

    I tried it on Adobe Dreamweaver CC version 13.0 build 6390 and it still works.
    I just need to change default background to #717171 and all color comment to #999.
    Thanks for this!

  • http://www.zmplus.com dandy

    how to use mac os

  • http://www.hagatorn.com Craig Chamberlain

    Nice work, needed this, saved a lots of time. Adobe should have a button for this.

  • Christine

    This is great! One question. I’m using Dreamweaver CC on a Mac. The colors look great except for a .txt file. The background is that same dark blue, but the text is black. I try to manually set the font color for a text file, but it won’t save. Do you know where in your .xml file I can update the text color?

    Thanks! Christine

  • http://thatwebguyblog.com That Web Guy

    Hi Christine,

    Honesty what you’ve described should work. Otherwise you can manually add it to the xml file:

    < colorGroup doctypes="Text">
    < syntaxColor id="CodeColor_TextText" text="#0CF" />
    < /colorGroup>

  • Khaleel

    Hi

    Been struggling to get this to work in Adobe Creative Cloud Dreamweaver CC 2014 which was released a few days ago on Mac

    i put my darkcoding scheme succesfully in this hidden folder /Users/yourusername/Library/Application Support/Adobe/Dreamweaver CC/nl_NL/configuration/CodeColoring

    change yourusername and nl_NL but still had look placing in..

  • Jason

    Worked for me in Dreamweaver CC 2014.

    Khaleel, it looks like you were in the wrong file location.

    Here is where I put it (on Windows 7):
    User/AppData/Roaming/Adobe/Dreamweaver CC 2014/en_US/Configuration/CodeColoring

    Rename original Colors.xml. Replace with new one. Restart Dreamweaver. Change bg color as per instructions.

  • http://www.bunglon.nl Egbert

    I noticed in Dreamweaver CC 2014 that the tagselecter under the screen is completely black, to solve that issue copy the following code inside the most upper colorgroup in the the downloaded xml file.

  • http://www.bunglon.nl Egbert

    I’m sorry, i did not know that i could not paste directly HTML (comment above)

    here is the link to a pastebin where you can copy the XML.

    http://pastebin.com/t3hcGutb

  • Mali Naeemi

    Pretty decent theme! Besides, I use “Consolas” Font with 10pt size, if anyone wants to try that out!

  • Kyle Lynn

    This is something everyone has been crying out for but unfortunately the dreamweaver team hasn’t seen it as a priority: https://forums.adobe.com/thread/1238406

BTT