Ade Malsasa Akbar contact
Senior author, Open Source enthusiast.
Monday, March 4, 2019 at 23:58



Before writing a GNOME 3 theming tutorial, I feel like to write a preparation tutorial as the basics for beginners. In this simple tutorial you will learn about what folders need to be created, what are their purposes, three different themes of GNOME, their directory structures, and of course what tool needed to setup themes. I hope this helps everybody who wants to customize their GNOME themes and to be ready for the next tutorial. Enjoy!


Required things


  • GNOME Tweaks
  • Extension Installation enabled
  • User Themes extension
  • ~/.themes/
  • ~/.icons/
  • /usr/share/themes/
  • /usr/share/icons/

Check your system


For example, on Ubuntu and Fedora you go to start menu and type About and run it. You will see the details of your GNOME Shell version. For example, picture below shows that my OS is Fedora 29 (the latest for now) and my GNOME version is 3.30.

(Details of my GNOME system)


1. The tool


Tweak Tool + enabled extension installation are needed. On Ubuntu, you can have it by performing this command line:
$ sudo apt-get install gnome-tweaks


Extension can be enabled if you have the chrome-gnome-shell package + Firefox addon called "GNOME Shell Extension" on your system. Later, you can go to extensions.gnome.org site and just click to install an extension. For example, on Ubuntu, do this:
$ sudo apt-get install chrome-gnome-shell


 (GNOME Tweaks)

(extensions.gnome.org site: simply click on the link on banner on top to install the needed addon)

2. The directories


  • ~/.themes directory is needed for GNOME Shell themes and GTK+ themes.
  • ~/.icons directory is needed for icon themes. 

(Nautilus shows the location of .themes and .icons directories (in blue highlights) along with other local directories of current user)


To create them, go to Nautilus and press Ctrl+H and create new folder named .themes. Do it again for .icons. Assume your ~ directory is /home/work then you see .themes and .icons folders beside other folders and their addresses are /home/work/.themes and /home/work/.icons, respectively.

If you want to install themes for all users in the system, you need:
  • /usr/share/themes/ to put GNOME Shell themes and GTK+ themes.
  • /usr/share/icons/ to put icon themes.

3. A GNOME-Shell-Theme directory structure


The most minimum example of a GNOME Shell Theme is Transparent Shell Theme. The directory structure is a directory where you can see a gnome-shell folder and then inside it gnome-shell.css file.


4. A GTK-theme directory structure


Like Flat-Remix-GTK below, a theme directory is a directory where you can see gtk-3.0 and index.theme. The folder Flat-Remix-GTK is the one you copy to ~/.themes folder in order to install it.



5. An icon-theme directory structure


Sometimes the structure looks like Marwaita below, sometimes it looks like Faenza besides it. But the folder of theme is always a folder where you can see index.theme file in it besides the folders. Don't worry, the folders with '@2x' postfix are designed for your High DPI monitors.





6. How to extract


Right-click > Extract here > you get the contents of that archive file appeared in current directory.

(Extracting a theme archive file from Nautilus File Manager)

Suppose there is an archive file "theme.zip" containing a folder named "theme/". Suppose you are now at ~/Downloads directory > you extracted the archive file "theme.zip" > you got a directory "theme/" > you see there are "theme.zip' file and "theme/" directory now in the ~/Downloads directory.


7. How to move a directory



It is better to move a directory using Nautilus File Manager into local user directory only, not into system directory. The rule is you copy correct theme directory to correct destination. Examples below explains that briefly:

  • GNOME Shell theme: Transparent shell theme: copy the Transparent shell theme folder which contains gnome-shell folder into ~/.themes folder
  • GTK+3 theme: Flat Remix: copy the Flat-Remix-GTK folder which contains gtk-3.0 folder and index.theme file into ~/.themes folder
  • Icon theme: Marwaita: copy the Marwaita folder which contains from 16x16 to 64x64 folders and index.theme file into ~/.icons folder
(Nautilus shows both ~/.themes and ~/.icons directories containing some Shell, GTK, and icon themes)


This article is licensed under CC BY-SA 3.0.