深海之蓝
深邃蓝调 / 专注沉稳. 流动色彩过渡、氛围光晕与充满未来感的数字美学。
你的名字
Why Choose the 深海之蓝 Style?
流畅的氛围渐变象征着前沿创新、充沛活力与现代数字化精湛工艺,在信息流中能够瞬间抓住访客视线。
高对比度清晰无衬线字体,确保在饱和渐变底色上依旧保持极致的可读性。
✦ Pro Designer Tips for this Preset
- 确保文字与渐变背景最亮处的对比度符合 WCAG AA 无障碍标准。
- 径向弥散光晕可在不干扰头像的前提下营造丰富的空间景深。
- 搭配亮色技术栈胶囊徽章(React, Next.js, TypeScript)。
Copy Design Tokens & CSS Variables
Directly use these custom color tokens in your Figma, Tailwind config, or CSS stylesheets:
:root {
/* 深海之蓝 (28) — header.name */
--banner-bg: #0a1a2f;
--banner-ink: #e8f1ff;
--banner-accent: #4da3ff;
--banner-wash: #16345c;
--banner-font: 'DM Sans', sans-serif;
}// Tailwind CSS Config
colors: {
banner: {
bg: '#0a1a2f',
ink: '#e8f1ff',
accent: '#4da3ff',
wash: '#16345c',
}
}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.