Windows 應用程式的樣式

樣式是讓您的應用程式脫穎而出的關鍵。本節的樣式指導方針協助您透過色彩、印刷樣式以及壓克力材質和顯色醒目提示等新功能,來建立 Fluent Design。

我們使用 Windows UI 程式庫 (WinUI) 來提供 UI 元件的最新樣式。 請務必使用最新的 WinUI 版本,讓應用程式保持最新狀態,並搭配目前的 Windows 應用程式 Fluent 樣式。 如需如何執行這項操作的詳細資訊,請參閱 XAML 樣式

Image depicting a color gradient.

色彩

色彩提供直覺式的方式尋找應用程式的各種資訊層級,並可作為強化互動模型的重要工具。

Image depicting typography.

印刷樣式

作為語言的視覺表示,印刷格式的主要工作是保持清晰。 其樣式絕對不能阻礙這項目標。 下列指導方針主要將說明如何使用印刷樣式,以協助使用者輕鬆了解內容。

Image depicting icons.

圖示

理想的圖示達到印刷格式與其餘設計語言的平衡。 它們不會混合使用隱喻,而且只會盡可能快速並簡單地溝通所需的內容。

Image depicting acrylic.

壓克力

使用壓克力建立深度感;壓克力是一種筆刷,可建立令人驚艷、透明的表面。

Image depicting reveal focus.

顯示焦點

顯示焦點是適用於 10 英呎體驗 (例如 Xbox One 和電視螢幕) 的光源效果,以及可設定焦點元素框線的動畫。

Image depicting sound.

音效

音效有助於讓應用程式的使用者體驗變完整,並提供他們額外的音訊銳度,以符合所有平台的 Windows 操作方式。

Short movie with a blinking cursor and then the words Writing style being typed out.

撰寫樣式

撰寫樣式可能會導致巨大的差異,是糟糕的使用者體驗和良好的使用者體驗的關鍵所在。

XAML 筆刷

您可以使用 XAML 架構,以許多方式自訂應用程式的外觀。 樣式可讓您設定控制項屬性,並在多個控制項重複使用這些設定來擁有一致的外觀。

XAML 樣式

您可以使用 XAML 架構,以許多方式自訂應用程式的外觀。 樣式可讓您設定控制項屬性,並在多個控制項重複使用這些設定來擁有一致的外觀。

間距

最佳化您的 Windows 應用程式,並提供最適合您應用程式功能和互動需求的使用者體驗。

圓角半徑

喚起溫暖和信任,並讓使用者更輕鬆地以視覺化方式處理 UI,並具有圓角。