LogoLogo
HomeNewsSupportVideos
  • Introduction
  • Getting Started
  • What's new in 4.0
    • Known Issues
    • .NET Core Designer
    • Managed Graphics
    • Fluent Markup
    • Markdown Support
    • Upgrade from 3.x
  • Releases
    • What's new in 4.0
    • What's new in 3.5
    • What's new in 3.2
      • View Builder
      • Validation Rules
      • Enhanced Font Support
      • Design-Time Debug
    • What's new in 3.1
    • What's new in 3.0
      • FAQs
      • Update Existing Projects
      • Multi Targeting
      • Visual Studio Designer
      • Referencing Assemblies
      • Docker Support
      • Troubleshooting
      • Deployment
    • What's new in 2.5
    • What's new in 2.2
    • What's new in 2.1
    • What's new in 2.0
    • Upgrade from 1.x
  • Getting Started
    • New Project
    • Templates
    • Troubleshooting
    • License Activation
    • FAQ
    • API
    • Hybrid
    • Deployment
    • Theme Builder
  • Concepts
    • Startup
    • Configuration
    • Load Balancing
    • Designer
    • Layouts
    • Client Profiles
    • Tab Order
    • Compression
    • Embedded Resources
    • Modal Workflow
    • Localization
    • RightToLeft
    • Background Tasks
    • Real Time Web Applications
    • JavaScript
    • JavaScript Object Model
    • Security
    • Synchronization
    • Session Management
    • Theming
    • Dependency Injection
    • Application Switches
    • Visual Studio Code
  • Controls & Components
    • General
      • Application
      • AutoSizing
      • AutoScroll
      • AutoScaling
      • Accessibility
      • Colors & Fonts
      • Embedded Tools
      • Events
      • Touch Events
      • Images
      • Labels
      • ToolTips
      • Data Binding
      • Common Properties
      • Custom Painting
      • Move & Resize
      • Drag & Drop
      • Validation
      • User Data
      • Responsive Properties
      • VB.NET Extensions
    • Common Dialogs
      • FolderBrowserDialog
      • ColorDialog
      • OpenFileDialog
      • SaveFileDialog
    • Editors
      • TextBox
        • TagTextBox
        • MaskedTextBox
        • TypedTextBox
      • DateTimePicker
      • MonthCalendar
      • TimeUpDown
      • DomainUpDown
      • NumericUpDown
      • TrackBar
    • Buttons
      • Button
      • SplitButton
      • CheckBox
      • RadioButton
    • Containers
      • Page
      • Form
      • Desktop
      • Panel
      • FlexLayoutPanel
      • FlowLayoutPanel
      • TableLayoutPanel
      • GroupBox
      • Accordion
      • TabControl
      • UserPopup
      • UserControl
      • ToolBar
      • StatusBar
      • SplitContainer
      • SlideBar
    • Lists & Grids
      • ComboBox
        • UserComboBox
        • TreeViewComboBox
        • ListViewComboBox
      • ListBox
        • CheckedListBox
      • TreeView
      • ListView
      • DataGridView
        • Column
        • TextBoxColumn
        • ButtonColumn
        • LinkColumn
        • ImageColumn
        • MaskedTextBoxColumn
        • DateTimePickerColumn
        • NumericUpDownColumn
        • CheckBoxColumn
        • ComboBoxColumn
      • DataRepeater
      • PropertyGrid
    • Extenders
      • Animation
      • ToolTip
      • ErrorProvider
      • Rotation
      • StyleSheet
      • JavaScript
    • Media
      • Audio
      • Video
      • FlashPlayer
    • Content
      • Label
      • LinkLabel
      • PictureBox
      • ScrollBars
      • Upload
      • AspNetPanel
      • ImageList
      • PdfViewer
      • ProgressBar
      • Spacer
      • Widget
      • WebBrowser
      • IFramePanel
      • HtmlPanel
      • Canvas
      • Shape
      • Line
    • Menus
      • MainMenu
      • MenuBar
      • MenuItem
      • LinkMenuItem
      • ContextMenu
    • Notifications
      • AlertBox
      • MessageBox
      • Toast
    • Other Components
      • Timer
      • BindingSource
      • BindingNavigator
      • DataSet
      • EventLog
      • MessageQueue
      • PerformanceCounter
Powered by GitBook
On this page
  • Ambient Properties
  • Custom Fonts
  • Designer
  • HTML Colors

Was this helpful?

Export as PDF
  1. Controls & Components
  2. General

Colors & Fonts

Color and font concepts.

PreviousAccessibilityNextEmbedded Tools

Last updated 4 months ago

Was this helpful?

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 , any named color in , or create a new color either by or passing the RGBA values.

For the fonts, you can use the by name, any , or create new fonts.

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.

Examples of color and font assignments:

// 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);
' 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)

Ambient Properties

  • BackColor

  • ForeColor

  • Font

  • Visible

  • Enabled

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.

Custom Fonts

You can use any font you like with Wisej. 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.

When adding a font to the browser, also make sure that the same font is installed on the servers and development machines or Wisej.NET will calculate the size of AutoSize controls incorrectly.

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.

  • Select any standard web color.

  • Select any color defined by the current theme.

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.

HTML Colors

Some properties in Wisej.NET are so-called "". When the property is not set, it returns the parent's value:

Select any system color from the enumeration. These colors are also translated by the current theme.

Use the class to convert HTML string to and from a Color object.

Ambient Properties
SystemColors
System.Drawing.ColorTranslator
System.Drawing.SystemColors
System.Drawing.Color
System.Drawing.SystemFonts
theme name
theme fonts