精選 · 開放 · 免費
Silentshark
具獨特手繪美學的暗色調氛圍感戰術模擬遊戲介面。
Dark ModeEditorialCalmCurationTypography
01
設計氣質 DNA
潛艦戰術靜默策略海洋
潛艦靜謐、昏暗的指揮中心,搭配發光的雷達顯示器。
02
色彩
#F9EAC2Accent
#F3F6FAInk
#C6CDD5Ink soft
#13202DBG
#1C2A38BG soft
#1B4747BG quiet
#434A52Muted
rgba(14, 18, 22, 0.82)Line
深色海洋背景與關鍵 UI 元素所用的溫暖發光色調之間,形成高對比。
03
字型
casual-script · monospace
- display
56px · 600 - body
16px · 400
所有文字採用休閒手寫字型家族,營造手繪感。 · 選單項目使用大寫字母並增加字間距。 · 強調文字使用溫暖的羊皮紙色以形成對比。
04
間距
4px
8px
16px
24px
32px
48px
64px
96px
選單項目之間寬裕的垂直間距,營造出平靜、從容的介面感。
05
表面 (圓角 / 陰影 / 邊線)
sm · 4px
md · 8px
lg · 14px
pill · 999px
按鈕與卡片上,在深色背景下採用半透明的淺色邊框。
rgba(17, 28, 38, 0.2) 0px 10px 20px 0px · rgba(7, 11, 16, 0.35) 0px 12px 26px 0px
06
版面
1280container
12columns
24pxgutter
768 / 1024breakpoints
中央 column 佈局,包含醒目的主視覺圖片與垂直選單堆疊。
07
動效與互動
160msmicro
260mssmall
800msmedium
cubic-bezier(0.23, 1, 0.32, 1)easing
hover 時平滑的 transform 與 opacity 轉場。 · 無浮誇動畫;細膩且注重氛圍。
選單項目有細膩的背景顏色變化與輕微 transform 效果。 · 無明顯的按下狀態;僅透過游標變化提示。
08
組件
- button 全寬矩形按鈕,具備半透明背景與細膩的 hover 轉場效果。
- card 用於顯示遊戲標題的大型圓角卡片,內含嵌入式美術圖。
- hero 戲劇性的中央卡片,包含氛圍美術圖與遊戲標題。
09
文案語氣與禁用清單
- 語氣 嚴肅、具氛圍感且注重策略。
- 標題風格 手繪風格、溫暖且引人入勝,儘管採用深色主題。
- 按鈕文案 簡潔、直接且不突兀。
- 避免使用明亮、飽和的原色——截圖顯示的是暗色、飽和度低的調色盤。
- 避免使用銳利、幾何或現代感的無襯線字體——截圖顯示的是手繪休閒手寫字型。
- 避免使用雜亂、擁擠且有多個競爭元素的佈局——截圖顯示的是平穩的中央 column 佈局。
- 避免使用快速、突兀的動畫或轉場效果——截圖顯示的是平滑、細膩的 hover 效果。
- 避免使用喧鬧、侵略性的號召行動按鈕——截圖顯示的是柔和、半透明的按鈕。
- 避免使用白色或非常淺色的背景——截圖顯示的是深邃、暗色的海洋背景。
- 避免: 避免使用明亮、飽和的原色。
- 避免: 避免使用銳利、幾何或現代感的無襯線字體。
- 避免: 避免使用雜亂、擁擠且有多個競爭元素的佈局。
- 避免: 避免使用快速、突兀的動畫或轉場效果。
- 避免: 避免使用喧鬧、侵略性的號召行動按鈕。
- 避免: 避免使用白色或非常淺色的背景。
11
System Prompt
Silent Shark 是一款具有暗色氛圍感介面的戰術潛艦模擬遊戲。設計採用色碼 #13202D 的深海背景與墨白色 #F3F6FA 以形成高對比。強調色為溫暖的羊皮紙色 #F9EAC2。字型完全採用休閒手寫風格(Patrick Hand, Special Elite)以營造手繪感。關鍵注意事項:避免明亮飽和的色彩、避免現代無襯線字體、避免雜亂的佈局、避免突兀的動畫、避免喧鬧的號召行動按鈕,並避免淺色背景。介面平穩、居中且注重氛圍,聚焦於遊戲的策略與靜謐本質。
把這份品味接進你的 Agent
把這套設計的機器可讀規格——色彩、字體、動效,整套 DNA——直接交給你的 AI Agent。
OpenDesign 技能 ↗
en · zh-CN · zh-TW · ja · ko