Rainbow

Overview

Colorizes enclosed content with one continuous rainbow char-by-char, where client-rendered content like the Keybind-Tag and its companions cannot, due to inherent limitations, be split up and will just be considered as an atomic unit.

<rainbow

  phase: number(0)

  ↪ Phase-offset of the transition; 0-100%

  override-colors: boolean(false)

  ↪ Whether to override already colorized members

  skip-whitespace: boolean(true)

  ↪ Whether to skip whitespace when coloring

  skip-non-text: boolean(false)

  ↪ Whether to skip atomic units like <key/>

  merge-inner: boolean(false)

  ↪ Whether to merge inner rainbows for continuity

  deep: boolean(false)

  ↪ Whether to dive into children's markup-attributes

>markup</>

Examples

Continuous Rainbow

The simplest form of a rainbow, using all standard attribute-values.

Code-Blocks are only available within the browser

Injected Color

By default, colorized members will keep their style and the transition will just skip over them.

Code-Blocks are only available within the browser

Split Individual Rainbows

In the following example, the text Code-Blocks are only available within the browser is to be colorized with individual rainbows per word, having the hyphens shaded in a mere grey-tone.

Code-Blocks are only available within the browser

The above could also be specified without making use of advanced features like loops and the explode-operator, just like the following example portrays:

Code-Blocks are only available within the browser

But the prior style allows for great flexibility when it comes to data-driven rendering, as injected monochrome passages may now be dynamically defined by the environment.

Split Continuous Rainbow

When the merge-attribute is enabled, inner rainbows will be joined in order to allow for visual continuity.

Code-Blocks are only available within the browser

Animated Split Continuous Rainbow

By binding the phase-offset to an environment-variable, all while altering said variable in-between calls to render, animations may be created.

Code-Blocks are only available within the browser

Deep Rainbow

With the Code-Blocks are only available within the browser-flag set, The rainbow will dive into the markup-attributes of its members in specified order and colorize their contents (if applicable) just as well; this allows for some neat effects.

Code-Blocks are only available within the browser

This feature works with an arbitrary number of attributes, so yes - crazy (and possibly useless) colorization like the following works also.

Code-Blocks are only available within the browser