Tessel: SaaS template for Framer

A SaaS template built on structure, not decoration. Numbered sections, a visible grid and one burnt-orange accent. Nineteen pages, five CMS collections, four breakpoints and no custom code. It reads like a product that has something to say.

What you get. 19 pages: Home, Product, Pricing with a comparison table, Integrations, Customers, Changelog and entry, Blog and post, Careers and role, About, Contact with a working form, Privacy, Terms, DPA, Licenses, 404 and a Style guide. 5 CMS collections (Reviews, Changelog, Integrations, Blog, Careers) already wired to lists and detail pages. A design system as Framer styles: 20 colour tokens, 17 text styles and 7 components, including a Button with four variants. Four breakpoints: Large (1440+), Desktop, Tablet and Phone. Anton, Geist and IBM Plex Mono from the Framer font library. No custom code.

Sections numbered like chapters. Every block carries a numeral anchored to the last line of its title. The page reads in order, the way a product with something to say should, and the numerals double as anchors for the navigation.

One accent does all the pointing. Burnt orange appears where the eye has to go: the key word in a headline, the primary button, the plan worth choosing. Nowhere on the site asks for a second colour, so the accent keeps its meaning.

Architecture in black and white, not people at laptops. Photography is greyscale architecture from Unsplash: structure, repetition, shadow. It keeps the accent as the only colour on the page and swaps in one click for your own imagery.

Tokens named by role, not by colour. Twenty colour tokens are named for what they do (Surface, Text, Line, Ink, Accent, Status), never for what they look like. A new palette is a token swap, not a redesign, and a dark theme is the same job.

Home, the product surface, customers, integrations, the blog and the phone breakpoint.

Developer tools, ops and data products, infrastructure, fintech. Anything that would rather look precise than friendly.

Limitations, so you know before you buy. Light mode only: tokens are named by role, so a dark theme is a token swap, not a redesign. No docs or help-center pages. Everything is demo content: legal pages, testimonials, logos and photos are placeholders to replace with yours.

What happens after I pay? Polar sends you a receipt and the remix link; open it, choose your Framer workspace, and the whole site is duplicated into your account.

Do I need a paid Framer plan? You can remix and edit on a free account; to publish on your own domain you need a Framer site plan.

Can I change the fonts and colours? Yes: colours are tokens named by role and fonts come from the Framer library.

What does support cover? Questions about the template and bug fixes, answered by a person within two business days.

Launch price $99, then $129. Live demo, details and purchase at miguelrecio.es/templates/tessel, or on the Framer Marketplace.

Made by Miguel Recio, identity and web designer (miguelrecio.es). Need it adapted to your brand, new pages or a full build? I do that as a separate service.