精選 · 開放 · 免費

Jitter

為每個團隊提供超快速的動態效果

designmotion
Jitter 網站截圖
↓ 下載設計系統包 (9 MB)在 OpenDesign 中開啟

原站: https://jitter.video

📦 瀏覽包內檔案 →

01

設計氣質 DNA

動態動畫速度協作團隊

專為瀏覽器打造的數位動畫工作室

02

色彩

#A481FFAccent
#19171CInk
#6E6E73Ink soft
#FFFFFFBG
#F2F1F3BG soft
#E5E4E7BG quiet
#97979BMuted
rgba(215, 215, 219, 1)Line

單色階調搭配單一柔和的紫色強調色

03

字型

grotesque-sans · humanist-sans · monospace

04

間距

4px
8px
16px
24px
32px
48px
64px
96px

一致的 4px 基線網格，區塊內距為 40px

05

表面 (圓角 / 陰影 / 邊線)

sm · 4px
md · 8px
lg · 12px
pill · 999px

無邊框或細微的 1px solid 邊框

0px 9px 21px 0px rgba(25, 23, 28, 0.1) · 0px 38px 38px 0px rgba(25, 23, 28, 0.09) · 0px 85px 51px 0px rgba(25, 23, 28, 0.05)

06

版面

1280container
12columns
24pxgutter
768 / 1024breakpoints

置中單欄主視覺區，全寬 logo 列

07

動效與互動

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.46, 0.45, 0.94)easing

捲動觸發的淡入效果 · 複雜的彈簧式線性變換 · 透明度過渡

游標變為手型，並有流暢過渡 · 細微的縮放或透明度回饋

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

Jitter — 桌面首屏（hero）
桌面首屏（hero）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jitter — 移动首屏
移动首屏

擷取自真實頁面 · 真 computed styles

11

System Prompt

Jitter 是一款快速、協作的動態設計工具。設計採用乾淨的白色背景，並以單一柔和的紫色作為行動呼籲的強調色。字體粗壯且乾淨，標題使用 grotesque-sans，內文使用 humanist-sans。關鍵設計元素包括大而具影響力的標題、藥丸狀按鈕以及充足的間距。避免使用深色模式、複雜的色盤或襯線字體。關鍵禁忌：避免雜亂的背景、避免使用多樣的色彩、避免按鈕使用銳角。

把這份品味接進你的 Agent

把這套設計的機器可讀規格——色彩、字體、動效，整套 DNA——直接交給你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko