Gnome3 customization -- Changing the Panel Colour and make It Transparent on Ubuntu 11.10 Desktop Edition

The /usr/share/gnome-shell/theme/panel-border.svg is the main file to be changed to change its appearance. Now wake the gimp expert in you

$: sudo gimp /usr/share/gnome-shell/theme/panel-border.svg

modify the file as you wish here i deleted the whole image

ctrl + a and Del

then took the brush tool choose colour black (default), set Opacity to 52 and made the brush image large enough to cover the full image painted once in the image then choose a colour, set Opacity to 100. Painted a line in the bottom, this will appear as the bottom border. Saved it as panel-border.png, because in gimp does not support saving a file in .svg format. Now open up the file /usr/share/gnome-shell/theme/gnome-shell.css

$: sudo nano /usr/share/gnome-shell/theme/gnome-shell.css

goto the section

#panel {
 color: #ffffff;
 background-color: black;
 border-image: url("panel-border.png") 1;
 font-size: 8.5pt;
 height: 1.86em;
 }

change the line border-image: url(“panel-border.svg”) 1; to

border-image: url("panel-border.png") 1;

save the file
reload the gnome3 desktop by hitting Alt+F2 then enter r and hit Enter