Skip to content
0:00 / 0:00

#cssshapes#clip-path#border-radius

Making Future Interfaces: Unusual Shapes

Heydon Pickering

6.4K subscribers • 1 video on Hallway

YouTube
  • Recommended by 1 person: 1 in engineering communities.
  • Presented by Heydon Pickering
  • May be out of date. Uploaded 7 years ago, in an area where tools change fast.

Intermediate. Assumes working knowledge.

19K views7 years ago1 recommendation

Web developmentCSS and layout

Heydon Pickering demonstrates how to create and wrap non-rectangular shapes in CSS using clip-path, border-radius, and paint worklets.

Your guide to making and wrapping shapes in CSS, using things like border-radius, clip-path, the CSS Shapes spec', and paint worklets. As ever, @BobbyCrisps (Twitter) supplies the Brian Butterfield impression at the end. Transcript: gist.github.com/Heydon/5a9a69421f2ac4b924f53849bd8b3b1c

Why it's here

1 person recommends this

What people say. Recommended as a creative and practical guide to advanced CSS layout and shape techniques.

u/harlampiin r/Frontend • Recommends

Making Future Interfaces: Unusual Shapes