Repeated pattern as background

How to use it

Use a repeating pattern as the background of a container or element and let the page background show through the pattern.

When to use it

This adds some visual interest, and softens the interface. It's not as visually heavy as a solid colour or image used as a background. It also lets you reinforce a theme if you choose the pattern based on the brand.

What to watch out for

Anything like this always runs the risk of interfering with the readability of the content in front of the pattern. The pattern should not call too much attention to itself.

The pattern might also not create very sharp or well defined edges for the container. As you can see below it's hard to tell that the corners of the container are rounded.

Examples