I found myself spending a huge amount of time skinning a DNN site and then there's this admin toolbar which was annoying me because it really doesnt fit into my design, yet there no way (at least from i can see) to provide a skin for it. So i had a bit of fun playing around with the css, and came up with this:

[ View Screenshot ]

Now i can manage my site in style! here's how its done:

Just add this code to your skin.css stylesheet:

#table2 a.commandbutton { padding: 2px 10px 2px 10px; margin-left: 5px; margin-right: 5px; text-decoration: none; text-align: center; vertical-align: middle; font-size: 11px; color: 333333; height: 19px; width: 45px; background-image: url('admin_button.gif'); background-repeat: norepeat; }
#table2 a.commandbutton:hover { color: #4580cd; }
#table2 td {  padding: 0px; }
#table2 td table td { padding: 0px; }
#table2 span.subhead { font-size: 0px; color: FFFFFF; }
#table2 label { font-size: 11px; font-weight: normal; height: 16px; color: 333333; }
#table2 table td input { display: none; }
#table2 table { margin-top: 3px; font-size: 0px; color: FFFFFF; }
#table2 input { margin-bottom: 2px; margin-right: 5px; }
#table2 { border-color: white; background-image: url('admin_tile.gif'); background-repeat: repeat-x; }

Then put this javascript at the bottom of your .ascx file:

<script type="text/javascript">
// Strip border from admin control bar
document.getElementById('Table2').style.borderWidth = '1px';
document.getElementById('Table2').style.borderStyle = 'Solid';
document.getElementById('Table2').style.borderColor = 'cccccc';
</script>

And put these images in your skin folder:

[ Download Background Image ]
[ Download Buttom Image ]

Now, the only thing left to do is set your admin toolbar style to classic by going to host settings > advanced settings > other settings > then select classic for 'control panel' dropdown.