Themes

Universal Dashboard is now a part of PowerShell Universal. This documentation is for reference to the v2 version of Universal Dashboard and is no longer maintained. 
PowerShell Universal Documentation can be found here.
Themes
Required Version: 1.4.0 or later
Themes are used to define colors for a dashboard without having to pass colors to each component. Themes can easily be defined as a hashtable and passed into New-UDTheme. Component and property names can be defined in a theme as well as CSS classes and attributes.
Creating a basic theme
To create a basic theme, use New-UDTheme. Values for any of the attributes can be any valid CSS definition.
$Theme = New-UDTheme -Name "Basic" -Definition @{
  UDDashboard = @{
      BackgroundColor = "rgb(255,255,255)"
      FontColor = "rgb(0, 0, 0)"
  }
}
Themes can then be passed into the -Theme parameter of New-UDDashboard.
Finding pre-defined themes
Universal Dashboard includes pre-defined themes. These themes can be found using the Get-UDTheme cmdlet. You can use these themes as parents to other themes.
Creating child themes
You can create child themes of pre-existing themes returned by Get-UDTheme. To create a child theme, pass the name of the parent theme to the Parent parameter of New-UDTheme.
$Theme = New-UDTheme -Name "Basic" -Definition @{
  UDDashboard = @{
      BackgroundColor = "rgb(255,255,255)"
      FontColor = "rgb(0, 0, 0)"
  }
} -Parent "Azure"
When defining a child theme, any properties that are defined in the child will override the parent. Any properties that are not overriden, will remain the same as the parent.
Available Properties
Themes support a basic set of defined properties. These properties are translated to CSS classes and attributes for you.
UDDashboard 
BackgroundColor
FontColor
UDNavBar 
BackgroundColor
FontColor
UDFooter
BackgroundColor
FontColor
UDCard
BackgroundColor
FontColor
UDChart
BackgroundColor
FontColor
UDCounter
BackgroundColor
FontColor
UDMonitor
BackgroundColor
FontColor
UDGrid
BackgroundColor
FontColor
UDTable
BackgroundColor
FontColor
UDInput
BackgroundColor
FontColor
Any of these properties can be used in a theme definition.
$Theme = New-UDTheme -Name "Basic" -Definition @{
  UDDashboard = @{
      BackgroundColor = "rgb(255,255,255)"
      FontColor = "rgb(0, 0, 0)"
  }
  UDChart = @{
      BackgroundColor = "blue"
  }
}
Using Raw CSS
In addition to the basic theme controls, you can also use CCS in your theme definitions. Both the key and values are translated to CSS selectors and properties.
$Theme = New-UDTheme -Name "Basic" -Definition @{
  '.ud-table' = @{
      font-size = '20px'
      font-style = 'italic'
  }
}
You can also mix and match the basic options with CSS.
$Theme = New-UDTheme -Name "Basic" -Definition @{
  '.ud-table' = @{
      font-size = '20px'
      font-style = 'italic'
  }
  UDCard = @{
      BackgroundColor = 'red'
  }
}
Colors
Security
Last modified 1yr ago