
























































FramerCN全新特性
轻松构建令人惊叹的Framer网站
全新特性
构建令人惊叹的网站
FramerCN全新特性
轻松构建令人惊叹的Framer网站





100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6






100%
Icons 1

Icons 2







100%






Santos
Emili
CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6






100%
Icons 1

Icons 2







100%






Santos
Emili
CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6






100%
Icons 1

Icons 2







100%






Santos
Emili
CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6






100%
Icons 1

Icons 2







100%






Santos
Emili
CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2






100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6







100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2






100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6







100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2






100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6







100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2






100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6







100%






Santos
Emili





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples





100%






Santos
Emili




100%
Header 1

Header 2

Header 3

Header 4

Header 5

Header 6





100%
Icons 1

Icons 2


CMS

Invite
PublishCollections
Blog
98
Blog Authors
8
Blog Categories
8
Case Studies
33
Docs
68
Events
24
Gallery
36
Jobs
47
Legal
6
Team
32
Updates
136
Add...
Synced

Notion
65

Google Sheets
12

Hubspot
32
Add...
Title
Image
Featured
Author
Category
Slug
Search 98 items…
How to design responsive websites without code

Yes
Andy
Tutorials
how-to-design-responsive-websites-without-code
8 must-have web animation tools

No
Paul
Inspiration
8-must-have-web-animation-tools
Interactive web design examples

Yes
Monika, Paul
Inspiration
interactive-web-design-examples
SVG animation mastery

Yes
Justin
Tutorials
svg-animation-mastery
11 professional animation strategies

No
Emili
Inspiration
11-professional-animation-strategies
7 principles for mastering SEO

No
Monika
Tutorials
7-principles-for-mastering-SEO
9 landing page best practices

Yes
Jurre
Inspiration
9-landing-page-best-practices
12 hover effects that transform user experience

No
Ben, Jurre
Inspiration
12-hover-effects-that-transform-user-experience
10 parallax scrolling examples

Yes
Paul
Inspiration
10-parallax-scrolling-examples
How Framer does AVIF

No
Ben
Engineering
how-framer-does-avif

Title
Interactive web design examples
Image

Interactive.jpg
Featured
Yes
No
Authors
Monika
Paul
Categories
Inspiration
Content
ParagraphNow that no-code tools have made interactive websites accessible to everyone, static designs aren't just underwhelming, they're a missed opportunity. But the best interactive websites don't just add a few fade-in
animations and call it a day. From interactive product previews to scroll-triggered storytelling, today's standout sites align interactivity with their brand and solve real business challenges.
Slug
interactive-web-design-examples
square.app/blog/interactive-web-design-examples
一站式设计与发布
完美兼容Framer,多方面协同增效
设计与发布
完美兼容Framer,多方面提效
一站式设计与发布
完美兼容Framer,多方面协同增效





100%
Button • Primary
Get Started
Button • Hover
Get Started
Secondary
Get Started
Secondary • Hover
Get Started
Accent
Get Started
Accent • Hover
Get Started






100%

Benjamin
Every project begins with a story. These are the brands we’ve helped tell theirs.






100%
Icons 1
Icons 2



framer.net.cn


Aug 6, 2025
#notes















100%
Button • Primary
Get Started
Button • Hover
Get Started
Secondary
Get Started
Secondary • Hover
Get Started
Accent
Get Started
Accent • Hover
Get Started












100%



Benjamin
Every project begins with a story. These are the brands we’ve helped tell theirs.









100%
Icons 1
Icons 2




framer.net.cn


Aug 6, 2025
#notes


framer.net.cn


Aug 6, 2025
#notes


framer.net.cn


Aug 6, 2025
#notes

完美兼容Framer Collaborate,无论你是协作,还是直接在页面上编辑文案,操作流畅,无需交接。
完美兼容Framer Collaborate,无论你是协作,还是直接在页面上编辑文案,操作流畅,无需交接。
完美兼容Framer Collaborate,无论你是协作,还是直接在页面上编辑文案,操作流畅,无需交接。
细节可控 上手即用
无需过多修改,只需复制粘贴
上手即用
无需过多修改,只需复制粘贴
细节可控 上手即用
无需过多修改,只需复制粘贴

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。

Framer Icon Set
Search…
矢量图标集. 绘制、编辑和管理完整的矢量集。非常适合图标制作。
Transition
Ease
Spring

Type
Ease In Out
Bezier
0.44, 0, 0.56, 1
Time
1
S
Delay
0.1
S
动画. 通过流畅的效果让设计栩栩如生。无需外部工具。
矢量绘图. 使用布尔运算和路径精确绘制图标或标志符号。

Variable
Weight
900
300
Italic
0
20
Variable
可变字体. 尝试使用不同的字体粗细、宽度和样式变体。


文本和颜色样式. 在你的设计中保持排版和颜色的一致性。

OpenType
B
B
E
E
F
F
Search…
Stylistic Sets
Stylistic Set 1
Yes
No
Stylistic Set 2
Yes
No
OpenType. 通过连字、替代字符等功能,开启高级排版体验。
借助社区资源更快启动
浏览超过400个可复制粘贴的资源内容
社区资源
浏览400+免费使用内容
借助社区资源更快启动
浏览超过400个可复制粘贴的资源内容
快速上手Framer
可以从0开始学习,也可以选择进阶课程
快速上手
从0开始,或持续进阶
快速上手Framer
可以从0开始学习,也可以选择进阶课程
入门指南
无障碍设计
账号与工作区
内容管理系统
创作者平台
企业版
常见问题
集成工具
本地化
发布管理
搜索引擎优化
故障排除
入门指南
入门指南
无障碍设计
无障碍设计
账号与工作区
账号与工作区
内容管理系统
内容管理系统
创作者平台
创作者平台
企业版
企业版
常见问题
常见问题
集成工具
集成工具
本地化
本地化
发布管理
发布管理
搜索引擎优化
搜索引擎优化
故障排除
故障排除
入门指南
入门指南
无障碍设计
无障碍设计
账号与工作区
账号与工作区
内容管理系统
内容管理系统
创作者平台
创作者平台
企业版
企业版
常见问题
常见问题
集成工具
集成工具
本地化
本地化
发布管理
发布管理
搜索引擎优化
搜索引擎优化
故障排除
故障排除









