Back to previous page

Feature Guide

1 min read

Framer Canvas 101

Essential concepts for new users.

Benjamin Libor

Key value of this Guide

Captures new-to-Framer traffic.

Captures new-to-Framer traffic.

Captures new-to-Framer traffic.

Captures new-to-Framer traffic.

Topics

Canvas basics
Starter concepts
Workflow tips

Audience

Beginners
Freelancers

If you’re brand new to Framer, the canvas can feel like a blank universe. This 101 guide covers the core concepts you need to start building without getting lost.

Pages and Frames

At the top level you’ll work with pages. Each page contains frames—sections, layouts, and components that make up your design.

Stacks and Layout

Stacks help you:

  • Align content horizontally or vertically.

  • Set consistent spacing between elements.

  • Create layouts that adapt when the screen size changes.

Text, Images, and Components

Framer gives you simple building blocks:

  • Text for headlines, body copy, and labels.

  • Image and video layers for media.

  • Components for reusable buttons, cards, sections, and more.

Preview and Publish

At any time you can preview your page as a live prototype, test interactions, and eventually publish to a production-ready site with a custom domain.

Conclusion

Framer Canvas 101 is about comfort with the basics: frames, stacks, components, and preview. Once those feel natural, you can layer in CMS, code components, and more advanced patterns at your own pace.

Don’t let your website make your Scaleup look second-rate.

Reach out to see if we currently have availability to take on new projects.

Allsite Studio is one of the Top 8 Globally Featured Framer Experts.

Request project

Allsite Studio is one of the Top 8 Globally Featured Framer Experts.

Request project

Questions,

and answers.

Questions,

and answers.

Questions,

and answers.

Service

Customers

Process

Terms

What services do you offer exactly?

Do you also do brand work?

Why Framer over Webflow?

Do I need a Figma design to start?

How long does a project usually take?

Can you help with content and copywriting?

Do you offer SEO setup or analytics integration?

Do you offer post-launch support?

Service

Customers

Process

Terms

What services do you offer exactly?

Do you also do brand work?

Why Framer over Webflow?

Do I need a Figma design to start?

How long does a project usually take?

Can you help with content and copywriting?

Do you offer SEO setup or analytics integration?

Do you offer post-launch support?

Request a project

Expect the next steps before a collaboration would start, to be like:

Request a project

Expect the next steps before a collaboration would start, to be like:

Request a project

Expect the next steps before a collaboration would start, to be like:

Budget

By submitting this form, you agree to the privacy policy.

Request a premium website

You'll receive a fix-price proposal 24hrs post call.