# Color

### 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

![](/files/L1DdvM6qmJVUWd3ZxYkj)

![](/files/NAhUdfH1MUcoJyCweWK1)

### Accent color

Common controls use an accent color to convey state information. By default, the accent color is the SystemAccentColor: <mark style="color:red;">**#F9575E**</mark> that users select in their Settings. However, you can also customize your app's accent color to reflect your brand.

![](/files/4lVqGprGNrM6gZrF40eA)

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.

![](/files/UDYOTVNx7tTvpUzCHeCL)

### 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

![](/files/2rrP6GrW4AG5BtWzRHQ3)

#### Dark theme

![](/files/jRLf7LkvukNE1xTBUmei)

### Sample code

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


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.sentre.io/design-pricinples/color.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
