# 个人品牌识别 —— 这个网站赖以建立的标志

> 案例研究：设计自己的标志 —— 构造、缩放、色彩与字体系统，以及它如何从网站图标撑到完整组合。

Source: https://ricardoportfolio.xyz/work/identity
Language: zh-Hans

---

李启达 Ricardo Costa
个人品牌识别 · 案例研究
2026
个人品牌识别
# 这个标志，基本上就是风格化的我。
这个标志是风格化的我 —— 眼镜、胡子、创意的那一面、技术的那一面，还有我一直自然而然在用的紫色。
阅读完整故事
![The Ricardo Costa lockup](https://ricardoportfolio.xyz/ricardo%20logo.svg)
01 — 命题
## 一个由「真正构成我」的那些东西做成的个人标志。
头发代表我创意的那一面，也代表我一直被吸引的那类工作 —— 插画、动画、品牌、视觉设计，以及做出有个性的东西。我不希望这个标志太商务、太通用，因为那就不像我了。
「有创意、重视觉、懂技术，还带点玩心。」
了解更多
01 / 要有辨识度
我希望它像我。
眼镜在那里，是因为我本来就戴眼镜。它也给了我一个很自然的方式来表现我工作的两面：一面偏视觉与创意，另一面偏技术。
02 / 两种角色
一只眼睛看设计，一只眼睛看怎么运转。
一面关心东西看起来如何、感觉如何、传达了什么；另一面关心它到底怎么运转。所以其中一片镜片带着技术符号 —— 指向 UI/UX、前端开发、React，以及真正把数字产品做出来。
02 — 构造
## 简单到哪里都能用。
系统规范
主组合标志
![The primary lockup](https://ricardoportfolio.xyz/ricardo%20logo.svg)
独立图标
![The standalone icon](https://ricardoportfolio.xyz/ricardo-costa-icon.svg)
发光字标
![The wordmark](https://ricardoportfolio.xyz/ricardo-wordmark.svg)
03 — 缩放
## 不管是很小、原尺寸还是反白，都认得出来。
图标缩放表现
通过
128px
64px
32px
头像模式
高对比反白
深色模式
![The lockup reversed on black](https://ricardoportfolio.xyz/ricardo-logo-light.svg)
在深色背景上，标志翻成暖纸白，只保留紫色镜片作为点缀。
04 — 品牌规范
## 色彩系统
墨紫
#2E0D5A — 框线与字标
电光紫
#9F66FF — 镜片高光
纸白
#F2F0EB — 作品集画布
墨黑
#0D0D0C — 默认深色 / 重色
主要标题点缀字体
Instrument Serif Italic
用紫色的理由很简单：它是我最喜欢的颜色。我一直自然而然偏向它，所以当我在做一个要代表自己的东西时，用紫色再合理不过。
结构与系统正文
Geist Variable
技术符号代表我工作中超出视觉的那部分 —— UI/UX、前端开发、React，以及真正把数字产品做出来，而不是停在设计阶段。
05 — 品牌应用
## 为我真正在做的工作而做的品牌识别。
开发者作品集页头（2026）
ricardocosta.dev
实验室
日志
Github
06 — 回顾
## 一只眼睛看好不好看，一只眼睛看好不好用。
总的来说，这个标志就是我工作方式的压缩版：重视觉、懂技术、带点玩心，既在意设计，也在意设计背后的东西。
进入实验场
