More Premium Hugo Themes Premium Jekyll Themes

Overkyll Jekyll Theme

A simple starter theme with an ITCSS Sass files organisation, a flexbox grid and modular typography

Overkyll Jekyll Theme

A simple starter theme with an ITCSS Sass files organisation, a flexbox grid and modular typography

Author Avatar Theme by bertrandkeller
Github Stars Github Stars: 55
Last Commit Last Commit: Dec 11, 2018 -
First Commit Created: Jun 19, 2023 -
Overkyll Jekyll Theme screenshot

Overview:

The Overkyll Jekyll Theme is a fast and light theme that can be used for both small blogs and larger websites. It implements various technologies such as ITCSS architecture, modular scale typography, Unison JS for unifying named breakpoints, LocalFont for web font caching, LoadingCSS for loading CSS asynchronously, Overpass font family, and Open Color for color optimization. The theme can be found on GitHub for easy access to the code.

Features:

  • ITCSS architecture: Uses the Inverted Triangle CSS architecture for better organization and maintainability.
  • Modular scale typography: Implements a modular scale for typography to ensure consistency and harmony in font sizes.
  • Unison JS: Provides a unified approach to named breakpoints across CSS, JS, and HTML, making it easier to manage responsive design.
  • LocalFont: Allows for web font caching using localStorage, resulting in faster page load times.
  • LoadingCSS: Provides a function for loading CSS asynchronously, improving performance and handling of CSS files.
  • Overpass font family: Uses the open source Overpass font family, inspired by Highway Gothic, for stylish typography.
  • Open Color: Utilizes a color palette optimized for user interfaces, including fonts, backgrounds, borders, and more.
  • Css lock: Implements progressive increasing font sizes for better readability, particularly in navigation elements.

Installation:

To install the Overkyll Jekyll Theme, follow these steps:

  1. Make sure Ruby is installed as Jekyll requires Ruby.
  2. Start a new site by running the following command:
jekyll new mysite
  1. Move into the newly created directory:
cd mysite
  1. Install Jekyll and Bundler by running the following command:
gem install jekyll bundler
  1. Download the Overkyll Theme by replacing the line gem "minima" with gem "overkyll-jekyll-theme" in the Gemfile.
  2. Run bundle install to install the required gems.
  3. Open the _config.yml file and change the line theme: minima to theme: overkyll-jekyll-theme.
  4. Start the server by running the command:
bundle exec jekyll serve
  1. Browse to http://localhost:4000 to view the site with the Overkyll Theme applied.

For migrating an existing site to the Overkyll Theme, make sure you have upgraded to at least Jekyll 3.3. Then follow the same steps as above, starting from step 5.

If you are using Jekyll 2.x, download the Overkyll Theme from GitHub, move into its directory, install required gems, and verify the installation by running bundle exec jekyll serve and browsing http://localhost:4000.

Summary:

The Overkyll Jekyll Theme is a lightweight and feature-rich theme for Jekyll websites. It offers a range of technologies and optimizations for improved performance and design. Installing the theme is straightforward, and it can be used for both new sites and migrating existing ones. With its ITCSS architecture, modular scale typography, and various other features, Overkyll provides a solid foundation for building blogs and websites.