Color

Color provides an intuitive way of communicating information to users in your app: it can be used to indicate interactivity, give feedback to user actions, and give your interface a sense of visual co

Color principles

Use color meaningfully: When color is used sparingly to highlight important elements, it can help create a user interface that is fluid and intuitive.

Use color to indicate interactivity: It's a good idea to choose one color to indicate elements of your application that are interactive. For example, many web pages use blue text to denote a hyperlink.

Color palettes

Accent color

Common controls use an accent color to convey state information. By default, the accent color is the SystemAccentColor: #F9575E that users select in their Settings. However, you can also customize your app's accent color to reflect your brand.

You can use the accent color palette for color theming in your app. Below is an example of how you can use the accent color palette on a button.

Themes

SenOS's apps can use a light or dark application theme. The theme affects the colors of the app's background, text, icons, and common controls.

Light theme

Dark theme

Sample code

<Grid>
    <Grid.Resources>
        <CornerRadius x:Key="ControlCornerRadius">8</CornerRadius>
    </Grid.Resources>
    <Button Content="Button"/>
</Grid>