https://github.com/devuri/ceres-theme
A clean, modern Jekyll theme for GitHub Pages. Uses Space Grotesk font, indigo accent colors, and a professional design system.
https://github.com/devuri/ceres-theme
Last synced: 14 days ago
JSON representation
A clean, modern Jekyll theme for GitHub Pages. Uses Space Grotesk font, indigo accent colors, and a professional design system.
- Host: GitHub
- URL: https://github.com/devuri/ceres-theme
- Owner: devuri
- License: mit
- Created: 2026-01-03T21:48:40.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2026-01-04T00:19:05.000Z (5 months ago)
- Last Synced: 2026-01-13T19:43:48.559Z (5 months ago)
- Language: SCSS
- Homepage: https://devuri.github.io/ceres-theme/
- Size: 91.8 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# Ceres Theme
A clean, modern Jekyll theme for GitHub Pages featuring Space Grotesk typography, an indigo accent palette, and a professional component system.
## Features
- **Modern Design** — Clean layouts with gradient accents and professional typography
- **Responsive** — Mobile-first design that works across all devices
- **Component Library** — Pre-built hero sections, pricing cards, bento grids, and more
- **Easy Configuration** — Simple YAML-based setup for navigation, footer, and social links
- **GitHub Pages Ready** — Works seamlessly as a remote theme
---
## Quick Start
### 1. Add the Theme
In your project's `_config.yml`:
```yaml
remote_theme: devuri/ceres-theme
```
### 2. Configure Your Site
```yaml
# Site settings
title: My Site
description: Your site description
# Navigation
navigation:
- title: Features
url: "#features"
- title: Pricing
url: "#pricing"
- title: Docs
url: /docs
# Call-to-action button (optional)
cta_button:
title: Get Started
url: "#pricing"
# Footer columns
footer_columns:
- title: Product
links:
- title: Features
url: "#features"
- title: Pricing
url: "#pricing"
- title: Resources
links:
- title: Documentation
url: /docs
- title: Support
url: /support
# Social links
social_links:
- platform: Twitter
icon: twitter-x
url: https://twitter.com/yourusername
- platform: GitHub
icon: github
url: https://github.com/yourusername
# Footer
footer_tagline: A short tagline for your site.
footer_copyright: "© 2025 Your Company. All rights reserved."
```
### 3. Create Your Homepage
Create `index.html`:
```html
---
layout: home
title: Home
---
```
---
## Layouts
| Layout | Purpose |
|-----------|--------------------------------------|
| `default` | Base layout with header and footer |
| `home` | Full-width landing pages |
| `page` | Standard content pages |
---
## Components
### Hero Section
```html
```
### Bento Grid
```html
Feature Title
Feature description
```
### Steps
```html
1
Step Title
Step description
```
### Pricing Cards
```html
```
### Call-to-Action Section
```html
```
---
## CSS Reference
### Buttons
| Class | Description |
|-------------|------------------------|
| `.btn` | Base button style |
| `.btn-glow` | Primary accent button |
| `.btn-ghost`| Outline button |
| `.btn-lg` | Large button variant |
### Sections
| Class | Description |
|------------------|--------------------------|
| `.section-gray` | Gray background section |
| `.section-number`| Small uppercase label |
| `.section-title` | Large section heading |
| `.section-desc` | Section description text |
### Layout
| Class | Description |
|---------------------|-----------------------|
| `.container` | Max 1200px, centered |
| `.container-narrow` | Max 720px, centered |
### Utilities
| Class | Description |
|-------------------------|--------------------|
| `.text-center/left/right` | Text alignment |
| `.mt-1` to `.mt-5` | Margin top |
| `.mb-1` to `.mb-5` | Margin bottom |
| `.w-100` | Full width |
| `.gradient` | Gradient text |
---
## Icons
This theme uses [Bootstrap Icons](https://icons.getbootstrap.com/). Example usage:
```html
```
---
## Customization
### Custom Colors
Create `assets/css/custom.scss` in your project:
```scss
---
---
:root {
--er-accent: #your-color;
--er-accent-dark: #your-darker-color;
}
```
Then add to `_config.yml`:
```yaml
custom_css: /assets/css/custom.scss
```
### Override Templates
Copy any file from `_layouts/` or `_includes/` into your project at the same path to override it.
---
## Migrating from Another Theme
To switch from Slate or another theme:
1. Remove the existing theme line from `_config.yml`:
```yaml
# Remove this
theme: jekyll-theme-slate
```
2. Add the Ceres theme:
```yaml
remote_theme: devuri/ceres-theme
```
3. Update your pages to use Ceres layouts and components
4. Commit and push
---
## File Structure
```
ceres-theme/
├── _includes/
│ ├── header.html
│ ├── footer.html
│ ├── hero.html
│ ├── bento-card.html
│ ├── pricing-card.html
│ └── cta.html
├── _layouts/
│ ├── default.html
│ ├── home.html
│ └── page.html
├── _sass/
│ └── ceres.scss
├── assets/
│ └── css/
│ └── style.scss
├── LICENSE
└── README.md
```
---
## Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
1. Fork the repository
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request
---
## License
This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.