56:I[473921,["/creators-assets/_next/static/immutable/chunks/456dxp3afc8vw.js","/creators-assets/_next/static/immutable/chunks/2bxtessbrg0z1.js","/creators-assets/_next/static/immutable/chunks/0bntpu9zyiup3.js","/creators-assets/_next/static/immutable/chunks/3283ev4bymz-y.js","/creators-assets/_next/static/immutable/chunks/0_p7_rfyih3ce.js","/creators-assets/_next/static/immutable/chunks/24bk4ojcoor5n.js","/creators-assets/_next/static/immutable/chunks/3x7cofmdt-u_a.js","/creators-assets/_next/static/immutable/chunks/18e_sauhpyyit.js","/creators-assets/_next/static/immutable/chunks/13xqrk3e5k8yu.js","/creators-assets/_next/static/immutable/chunks/00hohn9l3ocx9.js","/creators-assets/_next/static/immutable/chunks/3oybmd01gs-b6.js","/creators-assets/_next/static/immutable/chunks/0vxt9zvn936s0.js","/creators-assets/_next/static/immutable/chunks/1yn3k6g09tq32.js","/creators-assets/_next/static/immutable/chunks/3ly-i84yiij4i.js","/creators-assets/_next/static/immutable/chunks/1cey7skpirawe.js","/creators-assets/_next/static/immutable/chunks/3fujn21cf_mt1.js","/creators-assets/_next/static/immutable/chunks/2n9qmawfhavju.js","/creators-assets/_next/static/immutable/chunks/0m8lhf01xskqj.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3uo-268z2xnq9.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/2lxef2-u417vc.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/439i_r5_4eszl.js","/creators-assets/_next/static/immutable/chunks/2ch5kewqiwntv.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/3xmobvbzj3637.js","/creators-assets/_next/static/immutable/chunks/26fs9mkd8gzie.js","/creators-assets/_next/static/immutable/chunks/0toe1wcov_38e.js","/creators-assets/_next/static/immutable/chunks/110hzb6dmcbdr.js","/creators-assets/_next/static/immutable/chunks/2eiu9v0ook5ln.js","/creators-assets/_next/static/immutable/chunks/1zt764sfv2wd7.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3nd1mzwm7q_f7.js","/creators-assets/_next/static/immutable/chunks/3gx0_q52o4oil.js","/creators-assets/_next/static/immutable/chunks/0u_jiik6ovv_e.js","/creators-assets/_next/static/immutable/chunks/2warb3xv9rce7.js","/creators-assets/_next/static/immutable/chunks/1tvhyiuh-gmez.js"],"PostDetailCard"] 57:T8f8,

Topanga is a Framer template for studios that would rather show their work than shout about it.

Every page is built from one design system. Change a label, a title or an image once and it updates everywhere it appears. Spacing, containers and type follow the same rules on every page and at every screen size. Topanga comes with a built-in design-system skill for the Framer agent. Ask the agent for a new page and it builds it with the template's own components, colors, spacing and type, so the page looks native from the first draft.

Pages

- Home

- Work (CMS index)

- Case study (CMS detail page)

- Careers (CMS job listings and application form)

- Contact (enquiry form and studio details)

- 404

- Design System (style guide, hidden from search)

Features

- Fully responsive: desktop, tablet and phone layouts on every page.

- Works CMS: case studies with a cover, gallery, project details, rich-text case study and a "next project" link.

- 16 reusable components with simple controls, including Page Intro, Section Header, Case Card, Service Row, Stats, CTA Contact, Contact Detail and Button.

- Working forms: sending, sent and error states, and dropdown placeholders.

- Studio bento grid: subtle micro-interactions, scroll-linked layered cards and a 3D animated cube.

- Pixelating page transition: built with Framer's native page effects.

- Smooth scrolling and gentle scroll-in animations.

- Design system: 9 text styles and 11 color styles, documented on a dedicated page.

SEO-ready

- A unique title and description on every page.

- A custom share image and favicon.

- One H1 per page with a clean heading structure.

- Alt text throughout.

- CMS-driven metadata and share images for each case study.

- Editable brand assets: the share image and favicon are on their own canvas page, so you can restyle them in minutes

53:[["$","$L56",null,{"post":{"id":"01a1217d-2a2c-7588-a061-f1826a433104","title":null,"body":"

Fresh new Studio Agency monochromatic Template shipped!

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Fresh new Studio Agency monochromatic Template shipped!"}]}]},"author":{"framerUserId":"d2c15722-99ac-4628-a457-b894bfd868af","name":"Gabe Amaya","slug":"gabe-amaya","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37733/avatar-I5kWehYf68LUZsfVezux6xsbuH2Ppw.jpg","badges":["available","pro","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"75339","resolved":true,"title":"Topanga","body":"$57","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Topanga is a Framer template for studios that would rather show their work than shout about it."}]},{"type":"paragraph","content":[{"type":"text","text":"Every page is built from one design system. Change a label, a title or an image once and it updates everywhere it appears. Spacing, containers and type follow the same rules on every page and at every screen size. Topanga comes with a built-in design-system skill for the Framer agent. Ask the agent for a new page and it builds it with the template's own components, colors, spacing and type, so the page looks native from the first draft."}]},{"type":"customHeading","content":[{"type":"text","text":"Pages","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":" - Home"}]},{"type":"paragraph","content":[{"type":"text","text":" - Work (CMS index)"}]},{"type":"paragraph","content":[{"type":"text","text":" - Case study (CMS detail page)"}]},{"type":"paragraph","content":[{"type":"text","text":" - Careers (CMS job listings and application form)"}]},{"type":"paragraph","content":[{"type":"text","text":" - Contact (enquiry form and studio details) "}]},{"type":"paragraph","content":[{"type":"text","text":" - 404"}]},{"type":"paragraph","content":[{"type":"text","text":" - Design System (style guide, hidden from search)"}]},{"type":"customHeading","content":[{"type":"text","text":"Features","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Fully responsive:","marks":[{"type":"bold"}]},{"type":"text","text":" desktop, tablet and phone layouts on every page."}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Works CMS:","marks":[{"type":"bold"}]},{"type":"text","text":" case studies with a cover, gallery, project details, rich-text case study and a \"next project\" link."}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"16 reusable components","marks":[{"type":"bold"}]},{"type":"text","text":" with simple controls, including Page Intro, Section Header, Case Card, Service Row, Stats, CTA Contact, Contact Detail and Button. "}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Working forms:","marks":[{"type":"bold"}]},{"type":"text","text":" sending, sent and error states, and dropdown placeholders."}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Studio bento grid:","marks":[{"type":"bold"}]},{"type":"text","text":" subtle micro-interactions, scroll-linked layered cards and a 3D animated cube."}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Pixelating page transition:","marks":[{"type":"bold"}]},{"type":"text","text":" built with Framer's native page effects."}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Smooth scrolling and gentle scroll-in animations.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Design system:","marks":[{"type":"bold"}]},{"type":"text","text":" 9 text styles and 11 color styles, documented on a dedicated page."}]},{"type":"customHeading","content":[{"type":"text","text":"SEO-ready","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":" - A unique title and description on every page."}]},{"type":"paragraph","content":[{"type":"text","text":" - A custom share image and favicon. "}]},{"type":"paragraph","content":[{"type":"text","text":" - One H1 per page with a clean heading structure."}]},{"type":"paragraph","content":[{"type":"text","text":" - Alt text throughout. "}]},{"type":"paragraph","content":[{"type":"text","text":" - CMS-driven metadata and share images for each case study."}]},{"type":"paragraph","content":[{"type":"text","text":" - "},{"type":"text","text":"Editable brand assets:","marks":[{"type":"bold"}]},{"type":"text","text":" the share image and favicon are on their own canvas page, so you can restyle them in minutes"}]}]},"introduction":"Independent design studio","slug":"topanga","author":{"framerUserId":"d2c15722-99ac-4628-a457-b894bfd868af","name":"Gabe Amaya","slug":"gabe-amaya","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37733/avatar-I5kWehYf68LUZsfVezux6xsbuH2Ppw.jpg","badges":["available","pro","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d2c15722-99ac-4628-a457-b894bfd868af/01a12172-bf94-76a9-9ac8-69100f547223.jpg","metadata":{"tint":{"h":235,"s":81,"l":27},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d2c15722-99ac-4628-a457-b894bfd868af/01a12179-12fb-768e-b2d4-7b6471cfee48.jpg","metadata":{"tint":{"h":230,"s":86,"l":22},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d2c15722-99ac-4628-a457-b894bfd868af/01a1217c-9882-77d9-959c-838a6891bb83.jpg","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-10-09T16:26:52.539Z","updatedAt":"2026-10-09T16:26:52.539Z","publishedAt":"2026-10-09T16:26:52.518Z","featuredAt":null,"approvedAt":null,"type":"template","attributes":{"price":null,"paymentUrl":"https://framer.link/jnXpcf5","remixUrl":"https://framer.link/jnXpcf5","previewUrl":"https://topanga.framer.website/","categories":[{"id":218,"name":"Free","slug":"free-website-templates"}],"styles":[{"id":247,"name":"Professional","slug":"professional"},{"id":239,"name":"Monochromatic","slug":"monochromatic"},{"id":109,"name":"Modern","slug":"modern"}],"mainCategory":{"id":3,"name":"Agency","slug":"agency"},"features":[],"tags":[],"isAgentTemplate":false,"demoVideo":null,"skills":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-10-09T16:26:53.356Z","updatedAt":"2026-10-09T16:26:53.356Z","reported":false,"type":"post"}}],"$L58"]

Suggested for you