Espresso syntax theme for Google Chrome Inspector

Custom.css

/**********************************************/
/*
/* Espresso-inspired theme for Google Chrome Inspector
/*
/* By: Paul Redmond http://github.com/paulredmond
/* 
/* Inspired by Darcy Clarke's post - http://darcyclarke.me/design/skin-your-chrome-inspector/
/* Darcy Clarke's "Darker Skin" theme - http://darcyclarke.me/dev/inspectorskin/Custom.css
/*
/**********************************************/

/**********************************************/
/* Layout
/**********************************************/
#elements-content.source-code {
	background: #fff !important;
	font-size: 12px !important;
}

#elements-content .highlight { 
	color: blue;
}

#elements-content .selection {

}

#elements-content .selection.selected {

}

#elements-content .parent {

}

/*.outline-disclosure ol:focus li.parent.expanded.selected::before*/
#elements-content .outline-disclosure li.parent::before,
#elements-content .outline-disclosure ol:focus li.parent.expanded.selected::before {
	background: none !important;
	content: '' !important;
}

#elements-content .parent.selected {
	
}

#elements-content .parent.selected {
	padding-top: 2px !important;
	padding-bottom: 2px !important;
}

#elements-content .parent.expanded {
	
}

/**********************************************/
/* HTML
/**********************************************/
#elements-content .webkit-html-comment {
	color: #b2b2b2 !important;
}

#elements-content .webkit-html-doctype {

}

#elements-content .webkit-html-tag {
/*  color: #ffc97c !important;*/
	color: #4F9FCF !important;
}

#elements-content .webkit-html-tag-name {
    color: #2F6F9F !important;
    background-color: rgb(244, 250, 255);
}

#elements-content .webkit-html-attribute {

}

#elements-content .webkit-html-attribute-name {
	color: #4F9FCF !important;
}

#elements-content .webkit-html-attribute-value {
	color: #d44950 !important;
}

#elements-content .webkit-html-external-link {

} 

#elements-content .webkit-html-resource-link {

}

#elements-content .webkit-html-text-tag {

}

#elements-content .webkit-html-text-node {
	color: #333 !important;
}

#elements-content .webkit-html-css-node {
	color: #333 !important;
}

#elements-content .webkit-html-js-node {
	color: #333 !important;
}


/**********************************************/
/* CSS
/**********************************************/

#elements-content .webkit-css-comment {
    color: #b2b2b2 !important;
}

#elements-content .webkit-css-url {
    
}

#elements-content .webkit-css-color {
}

#elements-content .webkit-css-selector {
    color: #2F6F9F !important;
} 

#elements-content .webkit-css-property {
    color: #db6336 !important;
}

#elements-content .webkit-css-number {
    color: #8161c6 !important;
}

#elements-content .webkit-css-keyword {
    color: #3a1d72 !important;
}

#elements-content .webkit-css-string {
    color: #c37a2f !important;
}

#elements-content .webkit-css-important {
    color: #6700b9 !important;
    font-weight: bold;
}


/**********************************************/
/* JavaScript
/**********************************************/
#elements-content .webkit-javascript-comment {

}

#elements-content .webkit-javascript-keyword {
	color: #d97640 !important;
}

#elements-content .webkit-javascript-ident {
	color: #d97640 !important;
}

#elements-content .webkit-javascript-string {

}

#elements-content .webkit-javascript-number {

}

#elements-content .webkit-javascript-regexp {

}


/**********************************************/
/* Black arrows all the time
/**********************************************/
.audit-result-tree li.parent::before,
.console-group-messages .section .header::before,
.outline-disclosure li.parent::before,
.outline-disclosure ol:focus li.parent.selected::before,
.section .header::before,
.properties-tree li.parent::before,
.event-bars .event-bar .header::before,
.data-grid tr.parent td.disclosure::before,
.data-grid:focus tr.parent.selected td.disclosure::before,
.styles-section .properties li.parent::before
{
  font-family: 'Arial' !important;
  color: #aaa !important;  
  content: url(chrome-devtools://devtools/Images/treeRightTriangleBlack.png) !important;
  padding-right: 5px !important;
  font-size: 9px !important;
}

.audit-result-tree li.parent.expanded::before, 
.console-group-messages .section.expanded .header::before,
.outline-disclosure li.parent.expanded::before,
.outline-disclosure ol:focus li.parent.expanded.selected::before,
.section.expanded .header::before,
.properties-tree li.parent.expanded::before,
.event-bars .event-bar.expanded .header::before,
.data-grid th.sort-descending > div::after,
.data-grid tr.expanded td.disclosure::before,
.data-grid:focus tr.expanded.selected td.disclosure::before,
.styles-section .properties li.parent.expanded::before {
  font-family: 'Arial' !important;
  color: #aaa !important;  
  content: url(chrome-devtools://devtools/Images/treeDownTriangleBlack.png) !important;
  padding-right: 5px !important;
  font-size: 9px !important;
}

I don't know if it would help at all to use mine as a base, but it works (I think) in all of the tabs -- not just the elements tab. :)
https://gist.github.com/1150520

@bentruyman nice job, thanks for the tip!