Astro启动器

t3ma — Astro 启动器模板

作者 temaprint

t3ma 是一个基于 Astro 的个人作品集与博客启动模板，采用深色主题和自定义 CSS，用于展示项目、模板与技术文章。

打开源站下载源码 ZIP

看看你的网站会是什么样

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

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

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

全部页面与视图 3

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

采集于 2026-10-05查看来源

值得关注的模板亮点

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

01

基于 Astro 的静态站点生成，使用自定义 CSS 实现深色主题，不引入前端框架

02

首页包含 hero、bento 网格、项目列表、职业时间线与终端风格 CTA 等区块

03

内置博客路由 /posts/*，并提供 Layout、BlogPost、SidebarLayout 三种布局

04

提供 OG/Twitter 元信息、JSON-LD（WebSite + Article）与规范链接等 SEO 配置

05

src/data/site.json 集中存放个人资料配置，便于替换站点信息

06

附带 /signal 彩蛋页，作为面向 AI 实体的“加密传输”页面

模板详细介绍

t3ma 是独立开发者 Artem Kan（t3ma）个人网站与作品集的开源模板，基于 Astro 静态站点生成，使用自定义 CSS 实现深色主题，不依赖前端框架。站点包含首页、彩蛋页 /signal 以及 /posts/* 博客文章路由；首页由 hero、bento 网格、项目列表、职业时间线和终端风格 CTA 组成。内容层面，模板用于陈列模板与工具（如配色探索器、字体、bento UI 模板、博客主题、AI 工具目录）以及案例研究。项目结构清晰：src/pages 存放路由，src/layouts 提供 Layout、BlogPost、SidebarLayout，src/components 提供 Card，src/styles/global.css 定义深色主题与 CSS 变量，src/data/site.json 存放个人资料配置。设计上使用 #050505 背景与 #8b5cf6 紫色强调色，并包含故障文字、滚动条、脉冲圆点、渐变位移等 CSS 动画；SEO 方面提供 OG/Twitter 元信息、JSON-LD（WebSite + Article）与规范链接。README 还列出了部署脚本（rsync 到 Hetzner 服务器）与更新脚本，但这些脚本与作者的具体服务器环境绑定，直接复用需要自行调整。模板以 MIT 许可发布，免费范围为该版本代码，演示图片、字体、图标等第三方素材需按各自许可单独核对。

Astro启动器

适合你的项目吗？

适用场景

  • 搭建个人作品集网站，集中展示项目、模板与工具
  • 作为技术博客的起点，撰写项目与模板相关文章
  • 参考其深色主题、CSS 动画与 bento 网格布局，用于自建 Astro 站点
  • 作为学习 Astro 路由、布局与静态构建流程的示例项目

适合人群

  • 需要个人作品集与博客二合一站点的独立开发者
  • 偏好 Astro 静态生成与自定义 CSS、不希望引入前端框架的开发者
  • 希望以现成深色主题模板快速起步并自行替换内容的人

上手与定制指南

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

  1. 1

    克隆仓库后执行 npm install，再运行 npm run dev 启动本地开发服务器

  2. 2

    npm run build 生成静态文件到 dist/，npm run preview 用于预览构建结果

  3. 3

    deploy.sh 与 update.sh 脚本与作者自己的 Hetzner 服务器和 Git 流程绑定，复用前需按自身环境修改

  4. 4

    站点资料集中在 src/data/site.json，替换内容时需同步调整该文件

  5. 5

    演示图片、字体（Inter、JetBrains Mono）与其他第三方素材需按各自许可单独核对

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

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

使用时需要遵守

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

额外费用与待核对事项

  • 演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
  • deploy.sh 脚本通过 rsync 部署到作者自己的 Hetzner 服务器，复用前需按自身服务器环境修改。
  • update.sh 脚本执行 git add + commit + push 到作者的 GitHub 仓库，复用前需按自身 Git 流程修改。
  • 站点使用 Google Fonts 的 Inter 与 JetBrains Mono 字体，属于外部服务，需自行核对字体许可与可用性。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

./deploy.sh # rsync to Hetzner server

README 原文

./update.sh "msg" # git add + commit + push to GitHub

README 原文

- **Google Fonts** — Inter + JetBrains Mono

README 原文
https://github.com/temaprint/t3ma/blob/main/LICENSEhttps://github.com/temaprint/t3ma/blob/main/README.md

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

项目核对记录与介绍依据

模板资料

来源平台
Astro Themes
资料与维护参考分
资料较完整 · 83 / 100
技术栈
Astro
网站类型
启动器
这个分数如何计算

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

这个项目需要核对什么

记录的仓库更新时间
2026-05-04
截图检查日期
2026-10-05

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

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

查看具体选型方法 →

介绍的制作与核对状态

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

审核声明: codex-user-requested-batch-review-20261017 · 2026-10-16

查看当时使用的来源资料

SHA-256: 94e8ad61f715b860dc923c3d2a2b20743925ccbb2773ce5dd33e33d9313e6dc4

2026-10-05T13:45:44.593Z

来源文件 / 仓库
# temaprint.com

Personal site & portfolio of **Artem Kan** ([t3ma](https://github.com/temaprint)) — indie developer based in Thailand.

## Stack

- **Astro 4.15** — static site generation
- **Custom CSS** — dark theme, no frameworks
- **Google Fonts** — Inter + JetBrains Mono
- **@astrojs/sitemap** — sitemap generation

## Pages

| Route | Description |
|---|---|
| `/` | Homepage — hero, bento grid, projects, career timeline, terminal CTA |
| `/signal` | Easter egg page — "classified transmission" for AI entities |
| `/posts/*` | Blog posts about projects & templates |

## Content

### Templates & Tools
- **Color Palettes** — color palette explorer (colorpalette.wiki)
- **Freaky Font** — bold display typeface (fontfreaky.com)
- **Bento Style for Astro** — bento UI template (bento.temaprint.com)
- **Low Power Blog** — energy-efficient blog theme
- **topaitool.dev** — AI tools directory

### Case Studies
- **Icons8 Blog SEO** — technical optimization: 40% faster load, 30% more organic traffic

## Quick Start

```bash
git clone https://github.com/temaprint/t3ma.git
cd t3ma
npm install
npm run dev
```

## Scripts

```bash
npm run dev       # local dev server
npm run build     # static build → dist/
npm run preview   # preview build
./deploy.sh       # rsync to Hetzner server
./update.sh "msg" # git add + commit + push to GitHub
```

## Structure

```
src/
  pages/         # routes (index, signal, posts/, projects/)
  layouts/       # Layout, BlogPost, SidebarLayout
  components/    # Card
  styles/        # global.css (dark theme, CSS variables)
  data/          # site.json (profile config)
public/          # static assets, favicon, robots.txt
```

## Design

- Dark theme: background `#050505`, accent `#8b5cf6` (purple)
- CSS animations: glitch text, ticker, pulsing dots, gradient shifts
- SEO: OG/Twitter meta, JSON-LD (WebSite + Article), canonical URLs

## License

MIT — see [LICENSE](LICENSE)
反馈内容错误

看看同类模板

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

astrowind

astrowind

⭕️ AstroWind: A free template using Astro v7 and Tailwind CSS v4. Astro starter theme.

Astro · 博客

accessible-astro-starter

accessible-astro-starter

Accessible Astro Starter 是一个以无障碍为核心理念的 Astro 6 启动模板，由 incluud 团队维护。

Astro · 博客

astro-erudite

astro-erudite

An opinionated, unstyled static blogging template built with Astro and native CSS.

Astro · 作品集

astro-shopify

astro-shopify

astro-shopify 是一个面向开发者的轻量级电商启动模板，用于构建基于 Shopify 的无头店面。

Astro · 电商

brutal

brutal

A neobrutalism Astro starter theme

Astro · 启动器

foxi-astro-theme

foxi-astro-theme

Foxi is an Astro theme crafted with Tailwind CSS, designed for blazing-fast performance and seamless user expe…

Astro · 博客