Need help with octoflat?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

205 Stars 53 Forks 88 Commits 13 Opened issues


An Octopress theme based off Twitter Bootstrap v2 and Designmodo's Flat-UI

Services available


Need anything else?

Contributors list


This is a theme using Twitter Bootstrap and Designmodo's Flat UI theme which can be previewed on Designmodo's website. The awesome symbol font is from FontAwesome.

This theme has a live preview at

The theme now comes in two different color schemes: a light color scheme and a dark color scheme. The dark scheme is the default.



Please update the Wiki page if you are using this theme.

Installing the theme

As a submodule

$ cd your_octopress_dir
$ git submodule add .themes/octoflat
$ rake install['octoflat']
$ rake generate

Grabbing the latest updates as a module

$ cd your_octopress_dir
$ git submodule update

As a clone

$ cd your_octopress_dir
$ git clone .themes/octoflat
$ rake install['octoflat']
$ rake generate

Configuring Navigation

Add a navigation section to your _config.yml. Doing this allows the navbar to highlight the active page. Use the following format:

- text: Home
  url: /index.html

Adding New Pages

Create new pages by using the following command:

rake new_page['']

Go back to update your _config.yml file:

- text: Home
  url: /index.html
- text: New Page Title
  url: /new_page_name.html

Modifying the Color Scheme

The theme has two color scheme options: light and dark. The dark color scheme is the one enabled by default.

To change the color scheme after you've installed the theme, do the following:

$ cd your_octopress_dir/sass/custom/
$ vim _colors.scss
// Delete lines 3 and 18 and save
$ rake generate

LinkedIn Link

To get the LinkedIn link to work, modify your _config.yml to have this line:

$ linkedin_user: username

Your username can be found by going to your profile page. On your info card at the top of the page, theres a link to your public profile page. Extract out your username from the link.


This theme is licensed under a MIT License -

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.