Polaris 是 Shopify 商家後台的介面語言：淺灰 #F1F1F1 畫布托起白色卡片，近黑 #303030 承擔主操作，綠色 #008060 標記成功與品牌時刻。Inter 字型、8px 圓角與克制的邊框讓訂單、庫存與行銷表單在每天反覆操作中保持清晰、穩定、可預測。
Polaris設計系統
提示詞範本
基礎範本
Design a Shopify Polaris-inspired admin interface. - Light #F1F1F1 canvas with white surface cards; - Near-black #303030 primary buttons and #008060 brand green; - Inter font, 8px radii, #E3E3E3 hairline borders; - Merchant admin patterns: order tables, inventory forms, filters; - Calm, task-focused e-commerce workflows. Colors: #008060, #F1F1F1, #FFFFFF, #303030 with #008060 accent. Typography: Inter.
變體提示詞
📱 行動裝置
Design a mobile app with Polaris aesthetics. Use Polaris color identity with #008060 accents. Clean, touch-friendly, native feel.
💻 Web 端
Design a web application with Polaris style. Use Polaris color identity with #008060 accents. Professional, responsive layout.
📊 儀表板
Design a dashboard with Polaris design language. Use Polaris color identity with #008060 accents. Data-rich, organized, clear hierarchy.
📄 到達頁
Design a landing page with Polaris visual identity. Use Polaris color identity with #008060 accents. Compelling, conversion-focused.
使用範例
Polaris 訂單管理後台
儀表板Build an order management admin with Polaris style: #F1F1F1 canvas, white cards, #303030 primary buttons, green #008060 status accents, and dense data tables.
Polaris 商品上架表單
Web 端Design a product listing form with Shopify Polaris aesthetics: labeled inputs, 8px radii, clear sections, and #008060 save actions.
✅ 適用情境
- 電商商家後台
- 訂單與庫存管理
- 複雜表單工作流程
❌ 不適用情境
- 面向消費者的品牌官網
- 重動效的行銷頁面
DESIGN.md 檔案
符合 design.md 開放格式的設計系統描述，可複製或下載後交給 AI 程式設計工具使用。