Umbra Studio

Umbra is a dark, typographic template for design studios and creative agencies that work across identity, campaigns, motion and web. Home is a single screen: your logo or best images turn into a living cloud of particles that gathers, bursts and drifts with the cursor, with a short statement and four featured projects beside it.

Services open as large accordion rows that invert on hover and reveal an image, a description and the deliverables. Studio pairs a manifesto with a parallax photograph, a Swiss portrait grid of the team that turns from black and white to colour, and a grid of client logos. Every link scrambles into new letters on hover, and a wipe transition carries you between pages.

Projects, Services, Journal and Team all live in the CMS. Project pages have a cover, gallery, long text and a link to the next project, and featured projects appear on Home automatically.

A Styleguide page shows every colour, text style, link, component and the grid, and two built-in Framer Skills help in Framer AI: /customize walks you through content, SEO and the launch checklist, and /design-system keeps new sections consistent.

What's included

• 10 pages: Home, Work, Project, Services, Studio, Journal, Journal article, Contact, Imprint and 404, plus a Styleguide page

• Two Framer Skills: /customize and /design-system

• Particle Image hero that turns your images into an interactive point cloud

• Service accordions with a full-width inverted hover

• Swiss team grid with black and white portraits that turn to colour

• Client logo grid

• Matrix link hover across the whole site

• Wipe page transitions and text reveals

• 4 CMS collections: Projects, Services, Journal and Team

• Reusable Header, Button and Service Item components

• Responsive layouts for desktop, tablet and phone

• SEO ready, with titles, descriptions and social images per page

Set in Gambarino and Inter.