Hyde 1.x has been deprecated for the upcoming Hyde 2.0, available here.
An elegant open source, mobile first theme for Jekyll. It includes lightweight styles and placeholder content to get you up and running with a simple blog in no time.
1. Install Jekyll
Hyde is built for use with Jekyll, so naturally you'll need to install that. On Macs, it's rather straightforward:
$ gem install jekyll
You may also need to install Pygments, the Python syntax highlighter for code snippets that plays nicely with Jekyll. Read more about this in the Jekyll docs.
2a. Quick start
To help anyone with any level of familiarity with Jekyll quickly get started, Hyde includes everything you need for a basic Jekyll site. To that end, just download Hyde and start up Jekyll.
2b. Roll your own Jekyll site
Folks wishing to use Jekyll's templates and styles can do so with a little bit of manual labor. Download Hyde and then copy what you need (likely
atom.xml for RSS, and
public/ for CSS, JS, etc.).
3. Running locally
To see your Jekyll site with Hyde applied, start a Jekyll server. In Terminal, from
/hyde (or whatever your Jekyll site's root directory is named):
$ jekyll serve
Open http://localhost:4000 in your browser, and voilà. You're done.
Hyde includes a few options, typically applied via classes on the
As of v1.1, Hyde ships with optional themes based on the base16 color scheme. In Hyde, a theme simply changes the sidebar's background color and the color of links within blog posts. Here's the red theme in action:
There are eight themes available at this time.
To use a theme, add any one of the available theme classes to the
<body> element like so:
<body class="theme-base-08"> ... </body>
To create your own theme, look to the Themes section of Hyde's CSS. Copy any existing theme (they're only a few lines of CSS), rename it, and change the provided colors.
Hyde's page orientation can be reversed with a single class.
<body class="layout-reverse"> ... </body>
Open sourced under the MIT license.