Welcome to Vela

The Vela Theme is for Grav CMS. This theme is focused on usability rather than on design and was made to present large amounts of structured content. Vela is mobile-first, but offers settings to provide a good experience on desktops too.

Having troubles to get started or found a bug? Do not hesitate to open an issue. Like this theme? Leave a star on GitHub or just tell your friends. If you like to contribute to this project pull requests are welcome.


There is very little to no configuration needed to get started with your content. However, some options can be set in the Theme configuration. In the backend navigate to Themes > Vela to find these options.

If you like to have your notices styled like this one you are currently reading, install the Markdown-Notices plugin and simply disable Use built in CSS in Plugins > Markown-Notices in the GRAV Backend. There you can also change the words "Tip, Note, ...".

Basic Settings

Responsive settings

Markdown Notices Settings


To present your content, I recommend using plugins. The theme should work fine with most of them. You find plugins for many content types like images, videos or even math on the GRAV plugins page. Vela tries not to make any assumtions on how you present your content.

Table of Contents

Beside a default template Vela comes with an additional template to easily generate a decimal structured table of contents.

Just write Markdown like this, to generate a decimal structure.

1. First part
    1. Subpart of first part
    1. Some other section
        1. Dive into this topic
        1. And stay at this level
    1. Limits and other things
    1. Applications in Science
1. Second part
    1. ...

which renders like:

1. First part
    1.1 Subpart of first part
    1.2 Some other section
        1.2.1 Dive into this topic
        1.2.2 And stay at this level
    1.3 Limits and other things
    1.4 Applications in Science
2. Second part

Actually you dont even need this template. To generate the TOC without the template, you may simply enable Markdown-Extra and wrap the above Markdown content like this:

<div class="toc-page" markdown="1">