Framer - Design for Web Announcing Framer X. Join the waitlist. Announcing Framer X. Join the waitlist.

Design for Web

From websites to web apps, validate your design ideas faster with Framer. Easily scale your artboards to different sizes, add animations, use readymade icon sets, and more.

Start designing and prototyping for the web with Framer today.

Download Example ›

Web design, made smarter.

Design for different resolutions, then easily resize your artboards to check scalability. Our smart layout and hierarchy features and readymade Feather and Material icon sets help you design better and faster.

  • Insert shapes, text and images

  • Smart layout & hierarchy

  • Built-in icon sets

Framer CSS Dashboard

Perfect CSS in just one click.

Since Framer is a web-based design tool, all of your styling translates into perfect, copiable CSS. Plus, you can import libraries with NPM or insert dynamic data through APIs.

  • Web-based gradients model

  • Individual border radius & styling

  • Insert multiple shadows

Preview designs in context.

Enable scrolling and add simple animations, then upload to Framer Cloud to view your designs directly in the browser. Gather feedback and validate your ideas by sharing the Cloud link with collegues or clients.

Resources

Start tinkering with our web design template or download our web and wireframe kit.

Desktop Kit

Prototype with realistic macOS and Windows desktop environments.

Web Template

A multiple artboard template with perfect layout rules.

Web Kit

Download the Web Kit and start designing your next web project.

Wireframe Kit

Download the Wireframe Kit and start wireframing.

The best teams use Framer.

Join a growing list of companies who use Framer to make all the products you know and love.

Try Framer for free Pricing plans

Start your free 14‑day trial.

Enter your email and we‘ll send you a download link for later.

We recently introduced Frames and Shapes, so some information in these videos may be outdated. To learn more visit our Help Center.