{"id":"fluent-design","no":118,"name":"Fluent 2","ja":"フルーエント2","era":"2022–","family":"Microsoft UI","kind":"スタイル","collection":"Dictionary expansion 07","addedAt":"2026-08-18","source":{"title":"Microsoft Fluent 2 — Material","url":"https://fluent2.microsoft.design/material"},"reference":{"status":"verified","pageUrl":"https://fluent2.microsoft.design/material","credit":"Microsoft Fluent 2 — Material"},"essence":"色・文字・間隔・角丸・奥行きをトークン化し、Solid、Acrylic、Mica、Smokeという素材を用途ごとに使い分けてMicrosoft製品を横断する。","cues":["MicaとAcrylic","中立色の階層","柔らかな角丸","トークン化された奥行き"],"intents":["信頼","技術","静けさ"],"works":["WindowsやMicrosoft 365に馴染む業務UIを複数チームで揃えるとき","複数製品で一貫するテーマと状態表現を、既存製品へ段階的に置き換えるとき"],"recipe":{"type":"文字サイズと行間をトークンで定義し、画面側に直接の値を書かない","layout":"間隔を一つの基準値の倍数に固定し、密度違いは別トークンで持つ","material":"窓の地にはMica、Acrylicは一時的に現れる面へ限って使う"},"avoid":"ぼかしや影を面の役割とウィンドウ状態、ライト、ダーク、高コントラストに対応させる。画面ごとに一点物の色や余白を足すと、統一のための仕組みが維持対象を増やすだけになる。","colors":["#f1f3f5","#6b8eaa","#242a31"],"motif":"ui","pair":["glassmorphism","material-design"],"study":["Fluent 2","Acrylic","Mica","design tokens"],"en":{"essence":"Tokenizes color, type, spacing, radius and depth, deploying Solid, Acrylic, Mica and Smoke materials by role across Microsoft products.","cues":["Mica and Acrylic","Neutral tonal hierarchy","Soft corner radii","Tokenized depth"],"works":["Business UI at home in Windows and Microsoft 365 that several teams must keep identical","Replacing an existing product in stages so theme and state stay consistent across products"],"recipe":{"type":"Define size and leading as tokens and never hardcode values in a screen.","layout":"Fix spacing to multiples of one base and keep density variants as separate tokens.","material":"Mica for the window ground, Acrylic only for surfaces that appear briefly."},"avoid":"Match blur and shadow to surface role, window state and light, dark and high contrast. Adding one off colors and paddings per screen turns the unifying system into one more thing to maintain.","study":["Fluent 2","Acrylic","Mica","design tokens"]},"links":{"page":"https://indexstyle.org/styles/fluent-design","json":"https://indexstyle.org/api/styles/fluent-design","designSpec":"https://indexstyle.org/styles/fluent-design/design.md","imagePrompt":"https://indexstyle.org/styles/fluent-design/prompt.txt"},"usage":{"license":"CC-BY-4.0","licenseName":"Creative Commons Attribution 4.0 International","licenseUrl":"https://creativecommons.org/licenses/by/4.0/","attribution":"IndexStyle — https://indexstyle.org","attributionUrl":"https://indexstyle.org","scope":"Original IndexStyle text and structured data. Reference images, quoted works, and third-party material are excluded and retain their own rights."}}