UWP アプリのスタイルStyle for UWP apps

スタイル アイコン

アプリはスタイルによってさらに引き立ちます。ここで説明するスタイル ガイドラインは、色、文字体裁、アクリル素材や表示ハイライトなどの新機能を使用して Fluent Design を作成するのに役立ちます。Style is what makes your app stand out. The style guidelines in this section help you create a Fluent Design through color, typography, and new features such as acrylic material and reveal highlight.

hero image


Color provides intuitive wayfinding through an app's various levels of information and serves as a crucial tool for reinforcing the interaction model.

hero image


言語の視覚的な表現として、文字体裁の主な役割は明確であることです。As the visual representation of language, typography’s main task is to be clear. スタイルによってその目的が邪魔されてはなりません。Its style should never get in the way of that goal. 次のガイドラインでは、コンテンツをユーザーに理解しやすくするための文字体裁の使用方法について説明します。The following guidelines focus on how to use typography to help users understand content easily.

hero image


Good icons harmonize with typography and with the rest of the design language. They don’t mix metaphors, and they communicate only what’s needed, as speedily and simply as possible.

hero image


Create a sense of depth with acrylic, a brush that creates stunning, translucent surfaces.

hero image

Reveal highlight

Use light to illuminate important elements.

hero image

Reveal focus

Reveal focus is a lighting effect for 10 foot experiences, such as Xbox One and television screens, and animates the border of focusable elements.

hero image


Sound helps complete an application's user experience, and gives them that extra audio edge they need to match the feel of Windows across all platforms.

hero image

Writing style

Writing style can make a big difference between an awful user experience and a better one.

XAML styles

You can customize the appearance of your apps in many ways by using the XAML framework. Styles let you set control properties and reuse those settings for a consistent appearance across multiple controls.