Color

One of the simplest content engines in Television Simulator is the color engine. It allows you to display a solid color or gradient on the screen, which is useful for placeholders or to mix with other content to create a color filter.

color: "#ff0000"

channels:
  - number: 1
    color: |
      radial-gradient(ellipse at 20% 30%, rgba(56, 189, 248, 0.4) 0%, transparent 60%),
      radial-gradient(ellipse at 80% 70%, rgba(139, 92, 246, 0.3) 0%, transparent 70%),
      radial-gradient(ellipse at 60% 20%, rgba(236, 72, 153, 0.25) 0%, transparent 50%),
      radial-gradient(ellipse at 40% 80%, rgba(34, 197, 94, 0.2) 0%, transparent 65%)

Properties

The color engine has no additional properties; the shorthand color is the only property available.

Values can be any value accepted by the CSS background property, including solid colors, gradients, and even images. For example:

Gradients:

color: "linear-gradient(to right, #ff0000, #0000ff)"

Images:

color: "url(/content/images/my-image.jpg)"

Named colors:

color: rebeccapurple

Semi-transparent colors:

color: "rgba(255, 0, 0, 0.5)"

HSL colors:

color: "hsl(120, 100%, 50%)"