# Colors & Fonts

All controls in Wisej.NET have at least these three properties:

* **BackColor**. Sets the background color of the control. Returns the control's background color or the inherited color.
* **ForeColor**. Sets the text color of the control. Returns the control's text color or the inherited text color.
* **Font**. Sets the font of the control. Returns the control's font or the inherited font.

Some controls may have additional color properties, the names always end with "Color", and may hide the base BackColor or ForeColor properties. Each control (its corresponding widget) renders these properties on the client.

For the colors, you can use any [System.Drawing.SystemColors](https://docs.microsoft.com/en-us/dotnet/api/system.drawing.systemcolors), any named color in [System.Drawing.Color](https://docs.microsoft.com/en-us/dotnet/api/system.drawing.color), or create a new color either by [theme name](#theme-colors-and-fonts) or passing the RGBA values.

For the fonts, you can use the[ theme fonts](#theme-colors-and-fonts) by name, any [System.Drawing.SystemFonts](https://docs.microsoft.com/en-us/dotnet/api/system.drawing.systemfonts), or create new fonts.

{% hint style="warning" %}
The font you use must be installed on the server and it must be supported by the browser. If it's not a standard web font, then you need to add the font to the theme or a global CSS. In alternative, you may import ttf files on both the browser and the server, see [Enhanced Font Support](/docs/releases/whats-new-in-3.2/enhanced-font-support.md) for more information.
{% endhint %}

Examples of color and font assignments:

{% tabs %}
{% tab title="C#" %}

```csharp
// browser's "green" color.
this.BackColor = Color.Green;
// theme's "activeCaption" color.
this.BackColor = SystemColors.ActiveCaption;
// theme's "activeCaptionText" color.
this.ForeColor = Color.FromKnownColor(KnownColor.ActiveCaptionText);
// theme's "buttonText" color.
this.ForeColor = Color.FromName("@buttonText");
// theme's "buttonText" color.
this.ForeColor = Application.Theme.GetColor("buttonText");
// theme's backgroundColor value under the "button" appearance.
this.BackColor = Application.Theme.GetColor("button", "backgroundColor");
// green color at 50% transparency.
this.BackColor = Color.FromArgb(255/2, 0, 255, 0);
// green color from HTML string.
this.BackColor = ColorTranslator.FromHtml("#00FF00");

// theme's "defaultBold" font, style and size are ignored (leading @)
this.Font = new Font("@defaultBold", FontStyle.Regular);
// theme's "defaultBold" font, style and size are overridden (no @)
this.Font = new Font("defaultBold", 15, FontStyle.Bold);
```

{% endtab %}

{% tab title="VB.NET" %}

```visual-basic
' Browser's "green" color.
Me.BackColor = Color.Green
' Theme's "activeCaption" color.
Me.BackColor = SystemColors.ActiveCaption
' Theme's "activeCaptionText" color.
Me.ForeColor = Color.FromKnownColor(KnownColor.ActiveCaptionText)
' Theme's "buttonText" color.
Me.ForeColor = Color.FromName("@buttonText")
' Theme's "buttonText" color.
Me.ForeColor = Application.Theme.GetColor("buttonText")
' Theme's backgroundColor value under the "button" appearance.
Me.BackColor = Application.Theme.GetColor("button", "backgroundColor")
' Green color at 50% transparency.
Me.BackColor = Color.FromArgb(255/2, 0, 255, 0);
' Green color from HTML string.
Me.BackColor = ColorTranslator.FromHtml("#00FF00")

' Theme's "defaultBold" font, style and size are ignored (leading @)
Me.Font = New Font("@defaultBold", FontStyle.Regular)
' Theme's "defaultBold" font, style and size are overridden (no @)
Me.Font = New Font("defaultBold", 15, FontStyle.Bold)
```

{% endtab %}
{% endtabs %}

## Ambient Properties

Some properties in Wisej.NET are so-called "[Ambient Properties](https://docs.microsoft.com/en-us/dotnet/api/system.windows.forms.ambientproperties)". When the property is not set, it returns the parent's value:

* BackColor
* ForeColor
* Font
* Visible
* Enabled

{% hint style="danger" %}
In some cases, this behavior may be confusing, especially if the application sets a property and then expects to read back the same value. For example, if you set the Visible property to true but the parent is false, reading it back will return false.
{% endhint %}

## Custom Fonts

You can use any font you like with Wisej.NET. However, if the font is not known by the browser you need to add it to your theme - either create a custom theme, or use a mixin, or add it to a global .css file. In alternative, you may import ttf files on both the browser and the server, see [Enhanced Font Support](/docs/releases/whats-new-in-3.2/enhanced-font-support.md) for more information.

{% hint style="info" %}
When adding a font to the browser, also make sure that the same font is available on the servers and development machines or Wisej.NET will calculate the size of AutoSize controls incorrectly.
{% endhint %}

## Designer

All **Color** properties support the built-in color picker dialog. It allows you to:

* Pick any color from the color palette, or move the picker anywhere on the screen to sample the color directly from the display.

<div align="left"><img src="/files/-MMafZEjUXANPOzRp7dT" alt=""></div>

* Select any standard web color.

<div align="left"><img src="/files/-MMafzBIes0V1TjJlw06" alt=""></div>

* Select any color defined by the current theme.

<div align="left"><img src="/files/-MMag1_1zgwqqz_FcHMl" alt=""></div>

* Select any system color from the [SystemColors ](https://docs.microsoft.com/en-us/dotnet/api/system.drawing.systemcolors)enumeration. These colors are also translated by the current theme.

<div align="left"><img src="/files/-MMag4X0emd4iytansKT" alt=""></div>

All Font properties support the built-in font picker dialog. It allows you to:

* Pick a known standard web font, change the style and the size. You can pick multiple fallback fonts.
* Pick one of the fonts defined in the current theme. Once you pick a theme font, you can switch to the first tab to change the style and size.

<div align="left"><img src="/files/-MMah3ufv7Zz3GqkG4fb" alt=""></div>

## HTML Colors

Use the [System.Drawing.ColorTranslator](https://docs.microsoft.com/en-us/dotnet/api/system.drawing.colortranslator) class to convert HTML string to and from a **Color** object.


---

# 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/controls/general/colors-and-fonts.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.
