FOG

FOG is a Framer portfolio template for branding studios, design agencies, and independent creatives. Soft blur, film grain, and scroll-driven motion meet bold editorial layouts and CMS-powered case studies, so your work comes into focus.

What's inside

• Home page: a statement hero, selected work, an about section with a looping marquee, team, services, testimonials, client list, and contact form. All Home page text is managed in the CMS.

• Responsive layouts: every page and component is adjusted for desktop, tablet, and mobile, with breakpoint-specific type sizes, spacing, and layouts.

• CMS case studies: a Work page with cards filterable by service category, and detail pages driven entirely by CMS fields: story, gallery, testimonial, website link, and color palette.

• Sticky services section: scroll through five services, each with its own image and title, controlled through the CMS.

• Team section: a showcase for your people, with names and roles.

• Testimonials: a moving slider with client photos, names, and roles.

• Client list: a clean wall of brand names that you can edit in seconds.

• Contact page and form: a ready-to-use form with default, focus, error, and success states.

• Reveal footer: a footer that appears as the last section stays pinned in place.

• Atmosphere components: Progressive Blur for the navigation and edges, an animated Noise grain overlay, and an interactive Blur Hover Text effect, all adjustable in the right panel.

• Button system: one component covers every style, size, and state, plus icon buttons with open and close variants.

• 404 page and a built-in style guide documenting colors, typography, spacing, components, and CMS usage.

  Good to know

  • Fonts: Headings use Unbounded and body text uses Outfit. Both are free Google Fonts available in Framer's font picker, so no extra licenses or uploads are needed.

  • Images: Placeholder images are sourced from Unsplash and Lummi. Replace them with your own work before launch.

  • Support: abashgwen@gmail.com