Community forum for knowledge and support

Updated last year

The Colabs Header Design

At a glance

A community member found an amazing design on the Relume inspiration page and asked how to execute it, thinking they could use float or clear but unsure if that's the right approach. Another community member suggested that the design likely uses a regular rectangular image background with SVGs added on top to create a funky shape, such as rounded corners. The original community member thanked them and said they would try it out.

Useful resources

BBenedict Seidel

Hey guys, i found this amazing design in the relume inspiration page: https://library.relume.io/inspiration (colabs header). Does anyone know how to execute this? I was thinking I could use float or clear but it seems like that the wrong approach. Thanks in Advanced!

3 comments

SSam Parkinson

Hi Benedict,

I think they are have a regular rectangular image background, then they add svgs on top to make the image look as if it is in a more funky shape. E.g. they add the rounded corners as a grey overlay svg:

Hope that helps!

BBenedict Seidel

Thanks Sam! Seemes logic

BBenedict Seidel

Ill try it out asap 😄

Add a reply