语法网格
Bash 绿 / 代码画布. 等宽语法代码、CLI 终端顶栏与纯正的极客工程师美学。
你的名字
Why Choose the 语法网格 Style?
终端与 IDE 预设直观展示代码工程功底与命令行文化,不搞花哨虚饰,彰显纯正的硬核 Builder 身份。
纯正等宽代码字体(DM Mono, JetBrains Mono)搭配语法高亮色彩(青色、绿色、橙色)。
✦ Pro Designer Tips for this Preset
- 直接展示生产级主力技术栈:Docker, Kubernetes, Rust, TypeScript, Go。
- 经典的 Unix 终端三色控制点与窗口栏增添浓厚的极客认同感。
- 高度严格控制在 400px,确保个人主页置顶仓库卡片不被挤出首屏。
Copy Design Tokens & CSS Variables
Directly use these custom color tokens in your Figma, Tailwind config, or CSS stylesheets:
:root {
/* 语法网格 (45) — header.name */
--banner-bg: #0f1510;
--banner-ink: #9fe8b0;
--banner-accent: #4ade80;
--banner-wash: #1a2620;
--banner-font: 'DM Mono', monospace;
}// Tailwind CSS Config
colors: {
banner: {
bg: '#0f1510',
ink: '#9fe8b0',
accent: '#4ade80',
wash: '#1a2620',
}
}Template Usage & FAQ
Can I use the "语法网格" template across all social networks?
Yes. This template is designed with responsive coordinate scaling that perfectly formats for X / Twitter (1500×500), LinkedIn (1584×396), YouTube (2560×1440), and GitHub Profile README (1280×400) without any text clipping.
How do I customize the avatar, name, and badges in this template?
Click "Use This Template in Generator" above. You can load your GitHub profile automatically, change typography, adjust the Brand Kit palette, and download high-res PNG or vector SVG in seconds.
Is this template 100% free with no watermark?
Yes, 100% free and open. All rendering happens entirely inside your browser (local-first). No registration, no subscription, and zero watermarks.