拉丁字母、數字｜展示時字寬 118%
Rigid 85
Archivo
Variable｜wght 100–900、wdth 62–125
Brand Identity System — v1.0
光，
逐層成形。
這是 T3D 的品牌識別系統。標誌、顏色、字體、圖形、動態與語氣，所有規則都來自同一件事：光固化的原理。
下載標誌檔00Concept
T 是一座成型平台。
下照式光固化列印時，成型平台在上方，列印件倒掛在平台下。光從底部穿過樹脂槽，把貼著槽底的那一層固化；平台上升一層，再固化下一層。把這個剖面畫出來，就是一個 T。
- 橫槓Build plate
- 成型平台。一切從這裡往下長。
- 三層Layers
- 已固化的層。三層，也是 3D 的 3。
- 最底層Cure line
- 正在固化的那一層，所以是紫色。
- 間隙Gap
- 層與層之間的界線，逐層製造的證據。
01Logo
標誌
標準字由 T 符號與幾何的 3、D 組成，筆畫等粗、端點平切。優先使用完整標準字；空間不足時（頭像、favicon、小於 20 px 高）才單獨使用符號。
結構與安全空間
最小尺寸
標準字：螢幕高 20 px、印刷高 6 mm。符號：螢幕 16 px、印刷 5 mm。
固化層的顏色
淺底用 Cure Violet 60，深底用 Cure Violet 50，紫底用 Resin Amber。單色製程時整個標誌同色。
中文名稱
標誌不與中文名稱組合成固定標準字。需要並列時，中文放在安全空間之外，使用 Noto Sans TC Bold。
錯誤用法
不要拉伸或壓扁
不要旋轉或傾斜
不要替每一層換色
不要加陰影、外框或漸層
不要放在雜亂的影像上
不要填滿直豎的層間隙
02Color
色彩
四個核心色對應列印現場的四樣東西：光、樹脂、槽、成品。所有顏色以 OKLCH 定義，HEX 為 sRGB 對應值。點一下色塊可以複製色碼。
- 405 nm 的固化光。品牌主色：行動按鈕、固化線、重點數據。
- 液態樹脂與遮光罩的顏色。點綴色：軟質端、提示、紫底上的固化層。
- 樹脂槽的深。深色背景、主要文字。
- 固化後的白。淺色背景，帶一點暖。
色階
Cure
Resin
Neutral
Bio
使用比例
Paper 60Ink 25Violet 10Amber 5
紫色是光，不是底色。大面積的紫只保留給行動呼籲區塊；其餘時候，它只以一條線、一個數字或一顆按鈕出現。
硬度光譜
軟 10A46A68A類 Nylon硬 85 MPa
從 Resin Amber 漸變到 Cure Violet：液態、柔軟的一端是琥珀，固化、剛硬的一端是紫。只用來表示樹脂的軟硬，不作裝飾。
語意色
data-theme="light"
text-strong 標題
text-body 內文，用在段落。
text-muted 輔助文字與標籤。
text-brand text-accent text-bio
insetraisedinverse
data-theme="dark"
text-strong 標題
text-body 內文，用在段落。
text-muted 輔助文字與標籤。
text-brand text-accent text-bio
insetraisedinverse
語意色以 light-dark() 定義。任何區塊加上 data-theme="dark"，裡面的文字、線條與底色就會整組反轉，不必另外寫深色樣式。
對比度
| 組合 | 用途 | 對比 | WCAG |
|---|---|---|---|
| Aaink / paper | 標題與主要文字 | 18.0 : 1 | AAA |
| Aaink-soft / paper | 內文 | 9.9 : 1 | AAA |
| Aaink-mute / paper | 輔助文字、標籤 | 5.2 : 1 | AA |
| Aacure-60 / paper | 連結、重點 | 5.9 : 1 | AA |
| Aawhite / cure-60 | 主色按鈕 | 6.3 : 1 | AA |
| Aapaper / ink | 深色區塊標題 | 18.0 : 1 | AAA |
| Aamist / ink | 深色區塊內文 | 11.7 : 1 | AAA |
| Aacure-40 / ink | 深色區塊重點 | 7.1 : 1 | AAA |
| Aaresin-50 / ink | 深色區塊點綴 | 9.7 : 1 | AAA |
| Aaink / resin-50 | 琥珀底文字 | 9.7 : 1 | AAA |
03Typography
字體
三套字各司其職：Archivo 負責拉丁字母與數字，Noto Sans TC 負責中文，JetBrains Mono 負責數據與標籤。三者皆為開放授權字體。
繁體中文｜標題 Bold、內文 Regular
逐層成形
Noto Sans TC
網站依實際用字做子集化，兩個字重
規格數據、標籤、程式碼
405 nm
JetBrains Mono
Variable｜等寬數字
字級
text-hero
44 → 112 px｜首頁主標、樹脂名稱
逐層成形。
text-h1
38 → 80 px｜頁面標題
23 款樹脂
text-h2
28 → 52 px｜區段標題
印出來，就要能用。
text-h3
20 → 26 px｜卡片標題、特性名稱
大型薄壁不翹曲
text-lede
17 → 21 px｜導言
先決定要多軟或多硬，再看其他特性。
text-body
16 px／1.85｜內文
列印收縮率低於 0.5%，薄壁殼件不翹曲。
text-caption
13 px／1.65｜圖說、註記
表列數值為典型值。
text-label
11 px／+0.14em｜標籤、索引、單位
Layer 0042 / 0120
字寬｜font-stretch
Si Like 10A
100%｜內文與介面
Si Like 10A
118%｜樹脂名稱與大數字
數字｜tabular-nums
- 拉伸強度
- 55–65MPa
- 拉伸模數
- 2.5GPa
- 熱變形溫度
- 70°C
規格一律用等寬數字，數值靠右、單位縮小並降一階顏色，讓整欄數字可以上下對齊比較。
04Graphic language
圖形語彙
整套圖形只有一個單位：一層。線寬、圓角、紋理、網格都由它推導，所以畫面上不需要插圖，也看得出這是一家做逐層製造的公司。
固化線｜Cure line
2 px 的 Cure Violet，加上 14 px 的同色光暈。它標示「正在發生的事」：目前頁面、捲動進度、hover 中的卡片、表單的焦點。一個畫面裡同時亮著的固化線不超過兩條。
疊層紋理｜Layer texture
每 7 px 一條 1 px 的水平細線。只用在色塊與影像底，對比低到幾乎看不見，靠近才會發現。
層厚與圓角｜Layer & radius
2 px 層
1 px 髮線
圓角 2 px
圓角只有一種：2 px，等於一層的厚度。不使用膠囊形、大圓角或陰影卡片；層級用髮線與留白表達。
圖示｜Icons
箭頭
外連
層
平台
光
樹脂
16 px 網格、1.5 px 線寬、平切端點、不填色。圖示是標籤的輔助，不單獨承擔意義。
網格與間距
12 欄、欄距 24 px、版心最寬 1440 px，左右邊距隨視窗在 20–56 px 之間流動。區段上下留白 72–160 px。
- 2xs・6
- xs・8
- sm・12
- md・16
- lg・24
- xl・32
- 2xl・48
- 3xl・64
- 4xl・96
05Motion
動態
東西不是「飛進來」，而是「印出來」。動態只做三件事：逐層出現、被光掃過、隨平台上升。使用者偏好減少動態時，全部改為直接顯示。
逐層成形｜Layers
Rigid
標題與影像由上往下、分 12 階出現，像掛在平台下的列印件。900 ms，steps(12)。
固化線掃過｜Sweep
Hover把游標移上來
卡片、列表列與導覽項目在 hover 時，上緣由左至右亮起一條固化線。640 ms。
固化填滿｜Fill
按鈕的底色由下往上填滿，就像一層樹脂被固化。500 ms。
緩動曲線｜--easing-cure
cubic-bezier(0.2, 0.7, 0.1, 1)
起步快、收尾慢：光一照就反應，然後慢慢穩定下來。所有位移與進場共用這一條曲線。
時間｜Duration
- --duration-fast顏色、邊框
- 150 ms
- --duration-slowhover、位移
- 300 ms
- --duration-layer固化線掃過
- 640 ms
- reveal進場、逐層成形
- 900 ms
06Components
元件
網站以 Master CSS 建置：品牌 token 定義在 @theme，版面用 utility class，元件樣式放在 @layer components。以下都是正式環境使用的同一份樣式。
07Voice
語氣
T3D 說話像一位願意把話講清楚的材料工程師：精準、直接、不賣弄。四個原則，各附一組對照。
01先給數字，再給形容詞
這樣寫拉伸斷裂強度最高 85 MPa，120°C 下仍維持高強度。
不這樣寫超高強度，耐熱性能無與倫比！
02說它適合什麼，也說它不適合什麼
這樣寫需要與人體接觸，請改用 Tough-BC。
不這樣寫一款樹脂滿足所有應用。
03用動詞，不用口號
這樣寫能鎖螺絲、能反覆組裝。
不這樣寫打造卓越的全方位解決方案。
04把讀者當工程師
這樣寫120°C 烘乾後 24 小時吸水率約 0.3%。
不這樣寫幾乎不吸水，請安心使用。
書寫規則
樹脂名稱
一律用英文原名並保留大小寫與連字號：Tough-H、Si Like 10A。後綴 -BC 表示生物相容版本。
數字與單位
數字與單位之間空一格：85 MPa、100 µm、405 nm。溫度與百分比例外：120°C、0.3%。範圍用連接號：55–65 MPa。
用語
用「列印」「樹脂」「光固化」「設備」。中文使用全形標點，中英文之間留半形空格。
標籤
英文標籤全大寫、等寬字、字距 0.14em，只放一到四個字，當作索引而不是句子。
08Imagery
影像
我們用實拍，不用示意圖。實驗室裡拍的樣品照片不需要修得很漂亮，只需要被好好地歸檔：同一種框、同一種圖說、預設去色，互動時才還原顏色。
樣品框
髮線外框、2 px 圓角、底部一條半透明圖說列。比例只用 4:5、4:3、16:9。
去色與還原
預設灰階並與底色相乘，讓不同光線下拍的照片看起來屬於同一批；hover 時還原原色。圖表與流程圖保留原色。
圖說格式
「物件｜樹脂名稱」，右側放序號。描述看得到的東西，不寫形容詞。
09Applications
應用
同一套規則放到實體物件上的樣子。以下為示意，用來說明系統如何延伸，並非現有包裝或印刷品。
10Downloads
下載
所有標誌皆為 SVG 向量檔，可無限放大。請勿自行重繪或修改；需要其他格式，請來信 info@myt3d.com。
