The dots can be used as background elements or as overlays on images.
On light backgrounds, use dark blue at 20% opacity.
On dark backgrounds, use shell beige at 20% opacity.
For the colored dot, use light orange.

The size of the dots is based on the longest side.
The combined width and height of the dots equal 20% of the longest side.
The minimum margin from the edges is two separate dots.

‍

There is also a three-dot variant. This can be used with headings and quotes.

The size of the dots is based on the height of the text.
Together, the dots match the height of a single line of text.

The spacing between the text and the dots equals the size of one dot.
This spacing applies to both the start and the end of the text.

‍

The dots can also fill the entire background.
In this case, a gradient is placed behind text to keep it readable and avoid visual noise.
The gradient can be combined with a cutout.

‍

We've put together a set of icons that perfectly match OVO Vision's branding. The rounded shapes from the branding are reflected in the icons.