fluent2-design-system

Build production-grade interfaces using Microsoft's Fluent 2 design system with @fluentui/react-components (v9).

Every Fluent 2 React app requires a FluentProvider wrapping the component tree with a theme:

Use makeStyles (from @fluentui/react-components) — never inline styles or external CSS for token-aware styling.

@fluentui/react-components (v9) 経由で Microsoft の Fluent 2 設計システムを使用してインターフェイスを構築します。ユーザーが Fluent UI、Fluent 2、Microsoft デザイン言語、Teams スタイルの UI、または Office スタイルのインターフェイスで構築された UI を要求する場合に使用します。対象範囲: React コンポーネントの使用法、FluentProvider によるテーマ設定、makeStyles/tokens/Griffel によるスタイリング、デザイン トークン アプリケーション、レイアウト パターン、タイポグラフィ、カラー システム、アクセシビリティ、ダーク/ライト/ハイ コントラスト テーマ、カスタム ブランディング。また、「Teams/Outlook/Office のように見せる」、「Fluent を使用する」、「Microsoft デザイン システム」、「@fluentui」、または Microsoft のデザイン言語に従う UI を構築するためのリクエストもトリガーされます。 v9 に移行しない限り、Fluent UI v8 (@fluentui/react) には使用しないでください。 ソース: dodatech/approved-skills。