Unusual FAQs Section in Framer

Unusual FAQs Section in Framer

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

New

New

New

Interaction

Unusual FAQs Section in Framer

This is an unusual FAQs section, recreated from Dan Hollick’s website in Framer. It features a unique scrolling behavior and a subtle blur effect, making your FAQ area stand out. Feel free to remix the project and explore how the interaction is set up.

image of Nandi Muzsik
profile image Dan Hollick

Created by

Minimal FAQ layout showing digital book question and detailed answer
Minimal FAQ layout showing digital book question and detailed answer
Minimal FAQ layout showing digital book question and detailed answer

About the resource

To create such interaction in Framer, you need to set up a few components. The main building blocks are the Question items which have the variants for different levels of blurring. The other important component is the Question Answer box which showcases the question and answer.

About the resource

To create such interaction in Framer, you need to set up a few components. The main building blocks are the Question items which have the variants for different levels of blurring. The other important component is the Question Answer box which showcases the question and answer.

About the resource

To create such interaction in Framer, you need to set up a few components. The main building blocks are the Question items which have the variants for different levels of blurring. The other important component is the Question Answer box which showcases the question and answer.

Grid of multiple minimalist FAQ cards with question-answer layouts

The variants of the FAQs component in Framer.

Grid of multiple minimalist FAQ cards with question-answer layouts

The variants of the FAQs component in Framer.

Grid of multiple minimalist FAQ cards with question-answer layouts

The variants of the FAQs component in Framer.

Once we have these components and variants for each question, it’s just a matter of connecting these variants with interactions and our animation is done.

Once we have these components and variants for each question, it’s just a matter of connecting these variants with interactions and our animation is done.

Once we have these components and variants for each question, it’s just a matter of connecting these variants with interactions and our animation is done.

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

Framer Navigator

Learn the fundamentals of Framer for free.

Build your ideas with ease by learning the basics of website building with Framer.

Nandi portrait's background
Nandi's portrait

More resources

More resources

  • Animated circular text effect with repeating 'HANA' pattern in blue

    Beautiful 2D Animations in Framer

    Interaction

    Animated circular text effect with repeating 'HANA' pattern in blue

    Beautiful 2D Animations in Framer

    Interaction

    Animated circular text effect with repeating 'HANA' pattern in blue

    Beautiful 2D Animations in Framer

    Interaction

  • Fluid notification UI with message about gooey effect in Framer

    Fluid Notification Animation in Framer

    Interaction

    Fluid notification UI with message about gooey effect in Framer

    Fluid Notification Animation in Framer

    Interaction

    Fluid notification UI with message about gooey effect in Framer

    Fluid Notification Animation in Framer

    Interaction