Framer

Features

Resources

Community

Customers

Enterprise

Pricing

Log in

Start for free

Framer

Start for free

Layout

CMS

Localization

Effects

SEO

Navigation

Management

Resources

Features

Community

Templates

Academy

Updates

Feed

Partners

Experts

Community

Meetups

Awards

Customers

Enterprise

Pricing

Framer

Start for free

Layout

CMS

Localization

Effects

SEO

Navigation

Management

Resources

Features

Community

Templates

Academy

Updates

Feed

Partners

Experts

Community

Meetups

Awards

Customers

Enterprise

Pricing

Search

Get Started

Build your first site

Layout & Sizing

Breakpoints

Import from Figma

Components

Copy from HTML

code

start

Scroll

Scroll Targets

Sticky Scrolling

Scroll Animations

Scroll Transforms

Scroll Variant

code

scroll

Navigation

Desktop Menu

Mobile Menu

Mobile Menu: Fade-In

Horizontal Side Scroller

Scroll Direction

Relative Overlays

Responsive Dropdown Menu

code

navigation

Effects

Page Effects

Component Effects

Creative Effects

Rotating Grid on Scroll

Wave Animation

Apple Zoom Scroll Effect

Canvas-like website

Overlays

code

effects

CMS

Overview

Import

Filtering

Date Filtering

Conditionals & Transforms

Scroll Sections

Localization

Bold & Italic

Code Blocks

Reference Collections

code

cms

Insert Menu

Carousel

Cookie Banner

Input

Search

Slideshow

Ticker

code

insert

Settings

Metadata

Password Protection

Custom Code

Custom Domains

Redirects

Staging & Versions

Analytics

Version History

code

management

Code

Progress Feature Section

Courses

Fundamentals

Documentation Site

Mastering Code Overrides

code

courses

Academy

Code

Code

Learn everything about using code through Custom Code, Code Components and Code Overrides.

Progress Feature Section

Learn how to create an interactive component with a dynamic slide image and progress bar.

Progress Feature Section

Learn how to create an interactive component with a dynamic slide image and progress bar.