Themes: Trema

Maintained by Picture of Trevor FurtadoTrevor Furtado, Picture of Rodrigo MadyRodrigo Mady
Trema has a focus on usability and beauty, so for that to became real the developers have tried to make something clean and usable for everyone in the community.
789 sites
26 fans
Current versions available: 2

The "Trema" Moodle Theme

The theme Trema has a focus on usability and beauty, so for that to became real the developers have tried to make something clean and usable for everyone in the community.

The main goal for this theme is that the Moodle site will not need another site for information/advertising/marketing.

Nice features in trema: - It's based in the boost theme, so it will continue to be compatible with Moodle for a long time.

  • The frontpage is fully customized. It's possible to change the image banner. You can create up to six beautiful cards with custom contents and you can add custom HTML content with no restrictions.

  • The login page is awesome with Particles lib.

  • We really use Bootstrap to make the theme fully responsive.

  • The footer is highly customizable and we have an exclusive admin area block that can be seen and accessed only by the site administrator.

  • Thinking a little more about the administrators we made the admin dashboard area, so that they can see in real time some data about their Moodle.

  • The colours scheme can be changed in the theme settings.

Developed and maintained by

Rodrigo Mady 
Moodle profile: 
Web profile: 

Trevor Furtado 
Moodle profile: 
Web profile: 


As Trema is licensed under the GNU GPLv3 License it comes with NO support. So if you need some help talk to us in 'Moodle profile' in 'Developed and maintained by' above and we can discuss some improvements. To inform errors access Github Issues.


Ensure you have the version of Moodle as stated above in 'Required version of Moodle'. This is necessary as the theme relies on underlying core code. Move the folder trema to /theme/ folder from your Moodle installation. Access the Moodle Administration page (/admin) for do the necessary updates in your database.

For uninstalling trema you must change the theme. And in /theme/ remove the folder trema.

See the demo site

A demo site showing all available features of Theme Trema.


Documentation is available in Theme Trema.


The theme trema use the particles.js a lightweight JavaScript library for creating particles in login.


Screenshot #0
Screenshot #1
Screenshot #2
Screenshot #3
Screenshot #4


Picture of Trevor Furtado
Trevor Furtado (Lead maintainer)
Please login to view contributors details and/or to contact them

Comments RSS


  • Picture of Rodrigo Mady
    Thu, May 16, 2019, 8:48 PM
    Hi there vousmaei maei,

    You should access /admin/settings.php?section=logos to add your logos.

    And /admin/settings.php?section=themesettings to add custom navbar icons.
    Do something like this is settings custommenuitems:
    fa-puzzle-piece Plugins |
  • Picture of Bartosz Machul
    Mon, Jul 8, 2019, 1:42 PM
    This theme is AWESOME but I two problem's with it. First with forum activity - the users can't reply on forum because the buttons are not visible. You can click on it and reply but users don't see buttons.
    Second problem - and it's a big problem is in test activity. When somebody try to end test he can't click on save all answers and end test because the button is hidden by other activity on course (even hidden activity). The activity title is on the first stage and it's hiding the end test button. Do you plan to fix it? Other way i must to use other theme (after theme change everything is okay).
  • Picture of Isce Sec. Docente
    Fri, Aug 9, 2019, 10:14 PM
    Good morning, I wanted to ask you how to make the main page button referenced with the available courses? change the Frontpage button href = # frontpage-cards to the reference of the available courses.

    Thank you very much and excellent work.
  • Picture of Trevor Furtado
    Thu, Aug 15, 2019, 2:34 AM
    Isce Sec. Docente, this can be changed by setting "Frontpage button href" in:

    Site administration > Appearance > Themes > Trema > Content > Frontpage button href

    Change de value to:

    If the title get hidden by the navbar, you can add something like this in the "Raw SCSS" setting to add some space:
    div#frontpage-available-course-list:target {
    padding-top: 5rem;

    You can also use a link to another page instead of the anchor in the href setting.

  • Picture of Suzana de Andrade Ferreira
    Fri, Aug 16, 2019, 8:56 PM
    Really very wonderful theme! Visually clean and light, and beautiful!
    I have a question, maybe simple, when we edit the html using the atto editor, we only see a few lines and it is difficult to edit, because the cursor cannot access. Can you see that? Or just me?

  • Picture of Rodrigo Mady
    Wed, Aug 21, 2019, 2:58 AM
    Oi Suzana,

    Yes, this bug is real and it's fixed now heuheuhe
    I'll make another release as soon as possible.

    Thanks a lot for the contrib smile
  • Picture of Eman I.S
    Tue, Sep 3, 2019, 1:02 AM
    Is there anyway to remove the black shadow from the frontpage cover?
  • Picture of Trevor Furtado
    Tue, Sep 3, 2019, 1:26 AM
    Eman, you can host your image somewhere to have a url to it. If you dont have direct access to your server, you can add the image to de "main menu" block in your moodle's site home to get a static url.

    And them, in Site administration > Appereance > Themes > Trema > General Settings > Raw SCSS, add:

    #frontpage-banner {
    background-image: url(https://YOUR_BACKGROUND_IMAGE_URL);
  • Picture of Muhammad Nabeel Musharraf
    Mon, Sep 30, 2019, 2:57 AM
    Hello. Like all the above, I am also very happy with the neatness of theme.

    However, my issue is that the three-line menu icon on the top left corner of the screen is not appearing with me. There is a blank white box in its place. Can you kindly guide me what to do. Do I need to copy a file in some folder?

    KInd Regards,
  • Picture of Adegoke Badejo
    Thu, Oct 3, 2019, 9:03 PM
    Thanks for this beautiful and lovable theme. Please, kindly teach me how to add links and other menu options to the navbar. Thanks
  • Picture of Victor Santos
    Mon, Oct 7, 2019, 7:15 PM
    This theme looks amazing.
    But I am having an issue with dropdown fields, they are huge! Is this issue only on me or its to be that way.
    Please check from this screenshot:
  • Picture of Luis Armando Nieves De la Hoz
    Fri, Nov 1, 2019, 3:57 AM
    Excellent Theme. Please, can you help me? How can I do to change the main image on mobile devices? Thank you!
  • Picture of Suzana de Andrade Ferreira
    Sat, Nov 9, 2019, 7:48 AM
    Hey there!
    Is there a way to not resize the small logo or choose the logo instead small logo?

  • Picture of João Cardoso
    Thu, Nov 14, 2019, 10:07 AM
    Good Evening.
    I have made a Website using this theme for the site. However, I'm having troubles with the picture that I choose to became the frontpage banner do not appear in Explorer and Safari browsers but in Mozilla and Chrome it appears.

    Any solutions?


    João Cardoso
  • Picture of Jean Clark
    Sat, Nov 23, 2019, 11:06 PM
    How to i list my courses under categories rather than just a list of all available courses? I'm going to have HUNDREDS of Courses, I need these to be categorized properly.
    I'm kinda not liking the fact that this was removed from the functionality, it really doesn't make sense
    I really like this theme, but if I am not able to list categories on the main page or any other page instead of ajust a ton of available courses that students have to spend a lot of time navigating through, then it's a waste of time for me to learn this theme.
Please login to post comments