# Theming

Wisej.NET themes are collections of styles, fonts, and images that define the look and feel of components and other UI features. You can use one of the [built-in themes](https://docs.wisej.com/docs/concepts/theming#built-in-themes) or [create your own](https://docs.wisej.com/theme-builder/getting-started/create-new-theme).

See below for more information on theming and customizations.

{% embed url="<https://docs.wisej.com/theme-builder/>" %}

## Changing Themes

By default, new Wisej.NET applications use the [Bootstrap-4](#bootstrap-4) theme. The theme can be changed in several ways.

### Runtime

To change the theme at **runtime**, use the following line in your code:

```csharp
Application.LoadTheme("Bootstrap-4");
```

### Startup

To change the theme **before the application runs**, you can apply it in one of two ways:

{% code title="Web.config" %}

```xml
<configuration>
  <appSettings>
    <add key="Wisej.DefaultTheme" value="Bootstrap-4"/>
  </appSettings>
```

{% endcode %}

or

{% code title="Default.json" %}

```json
{
    "theme": "Bootstrap-4"
}
```

{% endcode %}

{% hint style="warning" %}
Changing the theme in the **Wisej.NET Designer in Visual Studio** will only show the changes at design-time. Use one of the above methods to apply it at runtime.
{% endhint %}

## Built-In Themes

New Wisej.NET applications come with several built-in base themes that can be used to style the application.

### Blue-1

This theme uses a blue base color, thick window borders and FontAwesome SVG icons.

![Wisej.NET Blue-1 Theme](/files/rgi3955L5px0MiFFKZ8b)

### Blue-2

This theme uses a blue base color, thick window caption, no side window borders borders and [Icons8](https://icons8.com/) SVG icons.

![Wisej.NET Blue-2 Theme](/files/Fhg5OsUWmAO3JgFSsxZG)

### Blue-3

This theme uses a blue base color, thick window borders and [Google Material](https://design.google.com/icons/#ic_library_books) SVG icons. Use it as a base to create new variations.

![Wisej.NET Blue-3 Theme](/files/mclxlkoWxfc5JZB4jxnZ)

### Bootstrap-4

This theme is based on the popular Bootstrap theme, using its distinctive colors, focus shadow, and Bootstrap SVG icons.

![Wisej.NET Bootstrap-4 Theme](/files/PwheEyX11UKullm8Wnnh)

### BootstrapDark-4

This theme is based on the popular Bootstrap theme, using its distinctive colors, focus shadow, and Bootstrap SVG icons. This theme has a dark background and light text.

<figure><img src="/files/TN1sGR282sauPBDGIboL" alt=""><figcaption><p>Wisej.NET BootstrapDark-4 Theme</p></figcaption></figure>

### Classic-2

This theme is based on Windows 10 metrics, font, and design. This theme uses the [Icons8](https://icons8.com/) SVG icons for Windows 10.

![Wisej.NET Classic-2 Theme](/files/MJmwJazaUO2zBfr8G5zh)

### Clear-1

This theme uses a clear base color, no side window borders, a thick window caption and [FontAwesome](http://fontawesome.io/) SVG icons.

![Wisej.NET Clear-1 Theme](/files/RvKDl1ivZXTq1OfNSR11)

### Clear-2

This theme uses a clear base color, no side window borders, a thick window caption and [Icons8](https://icons8.com/) SVG icons.

![Wisej.NET Clear-2 Theme](/files/yRtfMvQQN2mTddn6Y3Er)

### Clear-3

This theme uses a clear base color, no side window borders, a thick window caption and [Google Material](https://design.google.com/icons/#ic_library_books) SVG icons.

![Wisej.NET Clear-3 Theme](/files/I6M7CABHP2iK1H9vyQBO)

### Graphite-3

This theme uses overlapped scrollbars to implement cool disappearing and overlapped scrollbars similar to the Windows UWP style.

![Wisej.NET Graphite-3 Theme](/files/rm0ZiHTlrdMBANeZRUSD)

### Material-3

This theme is inspired by Google Material Design, with sleek animations, a large window caption, and a minimalist layout. It uses [Google Material](https://design.google.com/icons/#ic_library_books) SVG icons.

![Wisej.NET Material-3 Theme](/files/Nh1fVGHv3R15Hbtm8Jj4)

### Vista-2

This theme is based on Windows Vista metrics, font, icons and design.

![Wisej.NET Vista-2 Theme](/files/CGrK5phpLu89jcrJmzkH)


---

# 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.wisej.com/docs/concepts/theming.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.