USWDS 是美國聯邦政府的官方設計系統，一切都為可讀性與無障礙讓路：深藍 #005EA2 承擔連結與主操作，Public Sans 與 16px 內文保證長時間閱讀的舒適，2px 小圓角與高對比邊框讓表單、提示與步驟導覽在公共服務情境中清晰可信。
U.S. Web Design System設計系統
提示詞範本
基礎範本
Design a USWDS-inspired government interface. - Deep blue #005EA2 primary on a white canvas; - Public Sans typography with 16px body text; - 2px radii, #DFE1E2 hairline borders, #1B1B1B ink; - Accessible forms, alerts, and step navigation; - Plain, high-contrast public-service layouts. Colors: #005EA2, #FFFFFF, #DFE1E2, #1B1B1B with #005EA2 accent. Typography: Public Sans.
變體提示詞
📱 行動裝置
Design a mobile app with USWDS aesthetics. Use USWDS color identity with #005EA2 accents. Clean, touch-friendly, native feel.
💻 Web 端
Design a web application with USWDS style. Use USWDS color identity with #005EA2 accents. Professional, responsive layout.
📊 儀表板
Design a dashboard with USWDS design language. Use USWDS color identity with #005EA2 accents. Data-rich, organized, clear hierarchy.
📄 到達頁
Design a landing page with USWDS visual identity. Use USWDS color identity with #005EA2 accents. Compelling, conversion-focused.
使用範例
USWDS 福利申請表單
Web 端Build a benefits application form with USWDS style: deep blue #005EA2 primary, Public Sans, 2px radii, step indicator, and accessible inline validation.
USWDS 政務服務入口
到達頁Design a government service portal with USWDS aesthetics: high-contrast hero, plain-language cards, alert banners, and clear step-by-step navigation.
✅ 適用情境
- 政務與公共服務
- 無障礙優先專案
- 醫療與教育平台
❌ 不適用情境
- 潮流驅動的消費品牌
- 高飽和娛樂產品
DESIGN.md 檔案
符合 design.md 開放格式的設計系統描述，可複製或下載後交給 AI 程式設計工具使用。