Built this section around restraint. Same padding, same weight, no card trying to be louder than ...

Built this section around restraint. Same padding, same weight, no card trying to be louder than ...Built this section around restraint. Same padding, same weight, no card trying to be louder than ...

The network for creativity

Join 1.25M professional creatives like you

Connect with clients, get discovered, and run your business 100% commission-free

Creatives on Contra have earned over $150M and we are just getting started

Back to feedPost

Anubhav Saxena

• 16h

Built this section around restraint. Same padding, same weight, no card trying to be louder than the other. Worth it or overkill?

Biyas Iqbal

• 15h

Recently I worked a wellness coaching project called "grounded path"

Let's compare two of my hero section design of wellness coach design project.

Which one would you vote for?

#figma #ui #ux #hero section #website ui

11 votes

Ends in 1d

Design Yow

pro

• 12h

love the option one!

Ravi Rank

pro

• 12h

Bento Grid layouts look simple... until you try building one in Framer.

This layout took way longer than a standard landing page section because of:

✦ Custom curved center cutout

✦ Responsive overlapping cards

✦ Perfect border-radius alignment

✦ Layered gradients and shadows

✦ Pixel-perfect spacing across breakpoints

✦ Clean, reusable component structure The goal wasn't just matching the design. It was making it fully editable inside Framer without breaking responsiveness.

If you've ever tried recreating this type of layout, you know the clipping and overlapping sections are where most of the time goes.

Want the Framer remix? Comment "GRID" and I'll send you the remix link.

I'd love to hear how you would build the center cutout.

#Framer #BentoGrid #WebDesign #UIDesign #FreeResource #FramerCommunity #FreelancerLife #WebDevelopment #ResponsiveDesign #ComponentDesign