Curved background transition

How to use it

Used a curved transition between two background sections, rather than a straight horizontal transition.

When to use it

If you want a more interesting background transition, you can add a curve. It can either bend upwards or downwards. Adding more curves and round shapes to an interface gives it a softer feel, so this works well if your brand supports it.

What to watch out for

The more important section's background should probably curve or bulge into the less important section, since that section will take up more space than it would have with a straight line transition or a transition that curves inwards.

If your brand is all straight lines and sharp edges, you might want to avoid having curved background transitions since it'll be out of place.

Examples

Example