Pixelated rounded corners!

Generate pixelated rounded corners for your website using CSS clip-path!

Built by Luke Bonaccorsi

Read about how this technique works in the post on my blog

Values

1 visual pixel will be this many on-screen pixels

Radius of the corner before scaling, same as CSS border-radius

Preview

100px x 50px

A pixel art image of a spaceship

150px x 75px

A pixel art image of a spaceship

300px x 150px

A pixel art image of a spaceship

600px x 300px

A pixel art image of a spaceship