Jekyll博客

brutalist-blog — Jekyll 博客模板

作者 andrewhwanpark

brutalist-blog 是一个基于 Jekyll 的极简博客主题,能根据操作系统设置自动切换深色与浅色模式,并内置 SEO、站点地图与 RSS 等基础能力。

看看你的网站会是什么样

浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。

3 个预览视图
桌面端首页1 / 3
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 3

截图用于了解视觉与布局,交互效果请以实际项目为准。

采集于 2026-09-30查看来源

值得关注的模板亮点

从已有项目资料中,快速了解它的特点。

01

根据操作系统设置自动切换深色与浅色模式

02

完全响应式布局,提供桌面端与移动端适配

03

支持 Google Analytics 集成

04

自动生成 XML 站点地图与 RSS Atom 订阅源

05

使用 jekyll-seo-tag 输出面向搜索引擎和社交网络的元数据标签

06

完整 Markdown 支持,代码块与表格自动呈现为 Bootstrap 组件

模板详细介绍

brutalist-blog 是一个基于 Jekyll 的博客主题,定位为无多余装饰、完全响应式、极简的深色/浅色双模式主题,README 说明其设计受 Mark Otto 个人站点启发。主题会依据操作系统设置自动在深色与浅色模式之间切换,并提供桌面端与移动端两种布局。

在内容与站点配置方面,主题通过 _config.yml 集中管理站点标题、名称、页脚社交图标、导航栏头像等信息;永久页面参照 about.md、portfolio.md 的写法添加,并需在 _data/navigation.yml 中补充对应导航数据;博客文章参照 _posts 目录下的示例文章添加。自定义样式可通过新增或编辑 _sass/main.scss 完成。

功能上,主题支持与 Google Analytics 集成,可生成 XML 站点地图和 RSS Atom 订阅源,使用 jekyll-seo-tag 为搜索引擎和社交网络添加元数据标签,并完整支持 Markdown,代码块与表格会自动呈现为 Bootstrap 组件样式。安装方式为克隆仓库后执行 bundle install,再用 bundle exec jekyll serve 本地预览;若配合 GitHub Pages 发布,需切换到 gh-pages 分支并按 GitHub Pages 的 Pages 设置流程发布。

限制方面:主题未在资料中说明对 Jekyll 版本的具体要求;演示图片、字体、图标等第三方素材的许可需单独核对,不能仅凭代码的 MIT 许可判断;域名、托管等外部服务可能产生额外费用。

Jekyll博客

适合你的项目吗?

适用场景

  • 搭建以文字内容为主的个人博客
  • 需要深色/浅色模式随系统自动切换的站点
  • 通过 GitHub Pages 发布并托管 Jekyll 站点
  • 希望文章代码块和表格有统一 Bootstrap 样式的技术博客

适合人群

  • 熟悉 Jekyll 与 Markdown 写作的博主
  • 偏好极简、无多余装饰界面的个人站点作者
  • 使用 GitHub Pages 托管博客的开发者
  • 需要站点地图、RSS 与 SEO 元数据等基础能力的博客项目

上手与定制指南

结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。

  1. 1

    克隆仓库后需安装 bundler 并执行 bundle install,再用 bundle exec jekyll serve 本地预览

  2. 2

    使用 GitHub Pages 发布时需切换到 gh-pages 分支,并在仓库 Settings 的 Pages 中完成发布设置

  3. 3

    首次使用应修改 _config.yml 中的站点标题、名称、社交链接、头像等信息

  4. 4

    新增永久页面需参照 about.md、portfolio.md 的写法,并在 _data/navigation.yml 中补充导航数据

  5. 5

    自定义样式可新增或编辑 _sass/main.scss

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供;担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 集成 Google Analytics 需自行注册 Google 账号并获取跟踪 ID,属于外部服务,可能受其条款与隐私政策约束。
  • 使用自定义域名需自行购买域名并配置 DNS,域名注册与托管可能产生额外费用。
  • 主题设计受 Mark Otto 个人站点启发,若沿用其视觉风格需自行确认是否存在额外署名或授权要求。
  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

Easy integration with Google Analytics.

README 原文

Custom domains with Github Pages

README 原文

The theme is heavily inspired by Mark Otto's personal site: https://markdotto.com/

README 原文
https://github.com/andrewhwanpark/brutalist-blog/blob/main/LICENSE.txthttps://github.com/andrewhwanpark/brutalist-blog/blob/main/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-01。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料较完整 · 76 / 100
技术栈
Jekyll
网站类型
博客
这个分数如何计算

本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2021-08-29
截图检查日期
2026-10-01

已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Jekyll。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

已完成服务器许可规则与 AI 来源核对;未经过人工编辑审核。

查看当时使用的来源资料

SHA-256: 9bf28f2f361eb2daf2f2b7db38906556fd022cbf0ee8a9428948fb21c55a7202

2026-10-01T14:46:23.953Z

来源文件 / 仓库
# brutalist-blog

## Introduction

![brutalist-blog dark mode homepage](https://user-images.githubusercontent.com/13270895/131266947-65f2ae83-7d9e-48d7-8cd6-05a1d59df0ab.png)
![brutalist-blog light mode homepage](https://user-images.githubusercontent.com/13270895/131266950-3a0e0eff-0b15-4f60-ba22-231bcd78fb0c.png)
![brutalist-blog mobile homepages](https://user-images.githubusercontent.com/13270895/131266952-e245630a-9874-4bde-952c-3c63ebd745e0.png)

brutalist-blog is a no frills, fully-responsive, hyper-minimalistic dark/light theme. The theme is heavily inspired by Mark Otto's personal site: https://markdotto.com/

Demo: https://andrewhwanpark.github.io/brutalist-blog/

My personal site that uses the same theme: https://andrewhwanpark.github.io/

#### Features

- Automatically changes from dark/light modes depending on the OS settings.
- Easy integration with Google Analytics.
- Generates XML sitemap and RSS Atom feed.
- jekyll-seo-tag to add metadata tags for search engines and social networks to better index and display your site's content.
- Full markdown support: code blocks and tables are automatically bootstrap components.

![code blocks](https://user-images.githubusercontent.com/13270895/126393675-dacc65f1-7dd2-4651-ae2b-0e77eda7cd11.png)

![tables](https://user-images.githubusercontent.com/13270895/126393680-7b7fae57-abd0-4843-a9a1-c4f334b5eaa4.png)

## Installation

Clone this repo:

    $ git clone https://github.com/andrewhwanpark/brutalist-blog.git

If you haven't already, install bundler:

    $ gem install bundler

And then execute:

    $ bundle install

Serve the site:

    $ bundle exec jekyll serve

# Installation with Github Pages

After cloning the repo, checkout to the gh-pages branch.

    $ git checkout gh-pages && git pull

In the directory:

    $ bundle install

For local development:

    $ bundle exec jekyll serve

After tweaking with it, you can publish the site. Under your repository name, click Settings.

![tutorial](https://docs.github.com/assets/images/help/repository/repo-actions-settings.png)

In the left sidebar, click Pages.

![tutorial 2](https://docs.github.com/assets/images/help/pages/pages-tab.png)

To see your published site, under "GitHub Pages", click your site's URL.

![tutorial 3](https://docs.github.com/assets/images/help/pages/click-pages-url-to-preview.png)

For a more detailed guide, visit this guide by Github: https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll

## Usage

### First things first: \_config.yml

First, you should change data in \_config.yml to the appropriate information such as your social links for the footer icons, avatar for navbar logo, title and name of the site, and more crucial information.

### Adding content

In order to add permanent pages, add in similar fashion to about.md and portfolio.md and add apppropriate data to \_data/navigation.yml.

In order to add blog posts, add in similar fashion to \_posts/2021-07-16-this-post-demonstrates-post-content-styles.md.

### Custom style changes

If you wish to add custom styling through SCSS or CSS, you can add or edit \_sass/main.scss.

### Custom domains with Github Pages

Follow this simple guide: https://medium.com/@xiang_zhou/how-to-add-custom-domain-to-your-jekyll-blog-provided-that-you-built-your-site-using-github-6e1c8bf20afe

## Contributing

Bug reports and pull requests are welcome on GitHub at https://github.com/andrewhwanpark/brutalist-blog.

## License

The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
反馈内容错误

看看同类模板

对比同技术栈与用途的模板,找到更适合的视觉与内容结构。