A dark code view theme for Dreamweaver
Written May 25, 2009. 200 comments.
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.
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.
Instructions for Windows only
- 1) Close Dreamweaver
- 2) Browse to: C:\Documents and Settings\%username%\Application Data\Adobe\Dreamweaver 9\Configuration\CodeColoring (on WinXP)
or C:\Users\%username%\Application Data\Adobe\Dreamweaver 9\Configuration\CodeColoring (on Vista)
or C:\Users\%username%\AppData\Roaming\Adobe\Dreamweaver CS4\en_US\Configuration\CodeColoring (on Windows 7)
- 3) Rename the Colors.xml file to something different – say Colors2.xml (This will be the file you go back to if you don’t like the new colour scheme)
- 4) Download and extract the the zip at the end of this article to the location you opened at point 2.
- 5) Open Dreamweaver and go to Edit/Preferences/Code Colouring and change the default background colour to #003
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 users 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.
Start of page