01 / HORIZONTAL
SVG ↓spacelibre / identity layouts
视觉识别手册 · 从精确的轨道结构，到大胆的色彩与宇宙影像。
01 / CONSTRUCTION & SPACING
统一的结构，清晰的边界。
左右编排用于导航与产品界面；上下编排用于封面和居中展示；独立图标用于头像与紧凑空间。
星球与轨道
彩色版本的圆环是一个完整正圆，使用辅色；前景轨道使用主色。两者随全站配色变化。单色版本的圆环、轨道和完整字标统一使用黑、白或深蓝一种颜色，不参与主辅色拆分。交界处保留均匀留白，轮廓、环厚和尖端一起缩放。
结构示意 SVG ↓安全留白
以 SVG 画布高度的 25% 为 x，在画布外侧四周各留出至少 x。文字、边框及其他图形不进入安全区。
留白示意 SVG ↓| 版本 | SVG 画布 | 建议显示宽度 | 使用场景 |
|---|---|---|---|
| 左右编排 | 810 × 180 | ≥240 px | 网站导航、页脚、文档标题区 |
| 上下编排 | 620 × 430 | ≥180 px | 封面、启动页、品牌展示 |
| 独立图标 | 256 × 256 | ≥48 px | 头像、应用标识、紧凑空间 |
以上尺寸为建议值。24–32 px 时尖端与细缝会弱化，应按最终显示尺寸检查。
实时尺寸检查
拖动滑块，以实际像素宽度查看独立图标。
02 / COLOR SYSTEM
六套配色，一套完整的视觉秩序。
选择上方全站方案，或用拾色盘自定义主色。色彩会贯穿整个手册，以下展示当前方案的主色、深色基底与浅色基底。
点击色卡复制 HEX 色值。印刷色需按纸张、油墨和 ICC 配置转换并打样。
COLOR EXPLORER / 扩展配色实验室
只选主色，自动生成完整的全站色系。
六套方案控制整个网页：背景、文字、卡片、按钮、SVG 标志与辅助图形、影像遮罩同步变化。标志轮廓保持已确认的几何结构。
请输入有效的六位 HEX 色值，例如 #007BFF。
SPACELIBRE / EXPERIMENTAL SYSTEM
Beyond
the ordinary.
Explore
new possibilities.
主色承担识别，辅色塑造动势，强调色用于关键节点。
START EXPLORING ↗轨道稳定注意燃料连接中断
推荐面积关系：深色 / 浅色基底 60%，主色 25%，辅色 10%，强调色 5%。点击色块复制色值。
03 / TYPOGRAPHY & RHYTHM
清楚的信息层级，克制的技术语言。
spacelibre 字标使用现有矢量轮廓。网页正文与说明使用文字排版，方便阅读、选择和更新。
DISPLAY / ARIAL BOLD
Precision
in orbit.
主标题 48–80 px · 分区标题 28–40 px · 正文 16–20 px
METADATA / CONSOLAS
MISSION_01
STATUS: READY
SPACING: 8 / 16 / 24 / 32
技术标签 12–16 px；间距采用 8 px 基础节奏。中文说明使用系统无衬线字体。
04 / SUPPORTING GRAPHICS
轨道，不止是一条线。
大尺度裁切、色彩对撞、环形门、航迹网络、日蚀负形与多层光谱，构成更有冲击力的传播语言。完整 logo 继续保留安全区。
六种大胆的延伸应用
05 / NASA IMAGERY
让真实宇宙，成为品牌的舞台。
使用 NASA 官方发布的 Webb 影像作为辅助背景。文字采用网页排版，主标志使用跟随配色的 SVG；照片保持真实色彩。
调整遮罩，让标志和标题在复杂影像上仍然清晰。
SPACELIBRE / VISUAL EXPLORATION
Beyond the horizon.
SPACELIBRE / VISUAL EXPLORATION
Open possibilities.
Pillars of Creation / 创生之柱
Image: NASA, ESA, CSA, STScI; Image Processing: Joseph DePasquale, Anton Koekemoer, Alyssa Pagan (STScI)
NASA 官方来源 ↗
SPACELIBRE / VISUAL EXPLORATION
A universe of ideas.
06 / APPLICATION SYSTEM
同一套秩序，不同的画布。
主色建立识别，辅色与强调色通过连续曲线和渐隐色带自然衔接，装饰位于内容之后，不用色块遮掩切割。每个应用都随全站配色同步更新，预览和下载均为 SVG；占位内容可替换。
显示 40 个模板
品牌头像
1024 × 1024
名片 · 背面
96mm × 60mm
名片 · 正面
96mm × 60mm
数字横幅
1920 × 640
邮件签名
800 × 240
A4 信纸
210mm × 297mm
A3 海报
297mm × 420mm
演示文稿 · 结束
1920 × 1080
演示文稿 · 内容
1920 × 1080
演示文稿 · 封面
1920 × 1080
演示文稿 · 章节
1920 × 1080
A4 报告封面
210mm × 297mm
社交媒体 · 横向
1200 × 630
社交媒体 · 方形
1080 × 1080
社交媒体 · 竖向
1080 × 1920
网站导航
1440 × 160
网站首页 Hero
1440 × 900
开发者仪表盘
1440 × 1000
登录界面
1200 × 900
移动端欢迎页
1080 × 1920
移动端设置页
1080 × 1920
404 错误页
1440 × 900
GitHub 仓库封面
1280 × 640
版本发布公告
1080 × 1080
开发文档封面
1600 × 900
架构图画布
1600 × 1000
A4 证书
210mm × 297mm
DL 信封
220mm × 110mm
工作证
600 × 900
贴纸组合
1200 × 1200
包装封套
1600 × 800
帆布袋印刷图案
1200 × 1400
T 恤印刷图案
1200 × 1400
挂绳图案
1600 × 360
展会背景板
2400 × 1200
导视标牌
1600 × 700
活动入场券
1600 × 700
视频字幕条
1920 × 300
视频结束卡
1920 × 1080
邮件通讯页头
1200 × 500
没有找到对应模板，请调整关键词或分类。
名片成品 90 × 54 mm，四周 3 mm 出血；A4、A3 文件为成品尺寸，出血按供应商要求添加。
07 / USAGE PRINCIPLES
让标志始终保持一致。
推荐使用
- 按原比例缩放整个标志组合。
- 选择与背景对比清晰的配色版本。
- 保留安全留白，按最终尺寸检查细节。
- 由网格、留白与轨道形态建立科技感。
避免使用
- 拉伸、旋转或单独移动字标与图标。
- 改变环厚、轨道尖端或交界处留白。
- 替换字标字体，任意改变单个字母颜色。
- 添加发光、立体浮雕、描边或投影。
08 / VECTOR HANDOFF
网页负责阅读，SVG 负责设计交付。
15 个标志版本 · 10 个辅助与延伸图形 · 3 个规范示意 · 40 个应用模板 · 6 套扩展配色板 · 3 张 NASA 影像
网页可离线打开。SVG 自包含；标志字标保持矢量轮廓，新增应用的说明文字保留可编辑文本。替换旧模板轮廓文案时，请在设计软件中建立文字层。