About this template
What Knurl is
Knurl is a complete website for a design studio or agency. The demo is an industrial design studio, and the first screen shows what it makes: a product stands on a lit stage with three measured facts pinned to it, and you turn a dial of fine tick marks to bring the next product round. The products are images with a transparent background, lit by the page itself, so your own work takes the same light without an image editor.
It has thirteen page types: home, work with category filters, a long case study with before and after numbers, services with prices and a five-phase ring, studio and team, careers and a role page, a journal and an article, a project brief form, legal pages and a 404.
The site opens in dark mode on night plum, with ember as the only action colour, a light serif for headlines and one italic word in each. The dial runs through the whole site: it turns the stage, marks the phases of a project, sets the budget in the brief form, shows reading progress and switches the theme. Light mode is designed separately on warm blush. Every case study carries numbers a client would recognise: parts, repair time, return rate, unit cost.
Last updated
What's included
12 pages, ready to fill in
- 01HomeThe stage, clients, the product line-up, four results tied to projects, services with the phase ring, a featured case, the studio, client quotes, journal and a call to action
- 02WorkEight projects on small stages, filtered by category, with the choice kept in the address
- 03Case studyThe product with its pinned facts, the brief, before and after numbers, three steps, a gallery with a lightbox, the outcome, awards, the team and the next case
- 04ServicesThree ways to work together with prices, five phases on a ring and in a table, the workshop, honest cost ranges and questions
- 05StudioThe space, three principles, the team of eight, awards and a timeline
- 06CareersWhat working there is like, open roles with salaries and how hiring works
- 07RoleOne open role with its lists, a side card and a short application form
- 08JournalA featured note, the rest as rows, and category filters
- 09ArticleA reading layout with a pull quote, images, lists, the author and a progress ring
- 10Start a projectA brief form with chips, a budget dial, validation and a success state
- 11Privacy and TermsOne plain legal layout
- 12404A page for links that no longer exist
Features
- Product stage with five switchable products, a rotate and blur change, facts that draw in, and a light that follows the pointer
- A product line-up you scroll sideways, where each product lifts when you pick it
- Phase ring that follows the scroll and can be clicked
- Work filters that keep the choice in the address, with animated layout
- Case study gallery with a keyboard and swipe lightbox
- Brief form with chips, a budget dial with keyboard support, validation and a success state
- Dark mode by default, a light mode, and a toggle that remembers the choice
- Responsive on desktop, tablet and phone
- Still, complete pages with reduced motion
- CMS for projects, people, roles and journal posts on Framer
- Text, colours and images are yours to change
Code version
- React 19
- Vite
- Tailwind CSS 4
- TypeScript
- Motion
- React Router
- Content in typed files
Screens
A closer look
Taken from the live demo, in light and in dark, on desktop and on a phone.
Where to get it
Three versions, one design
Pick the one that matches how you build. The pages and the design are the same in each.
- Framer templateRemix it into your Framer account and edit on the canvas. Projects and journal posts run on the Framer CMS.
Free on FramerFramer Marketplace
- Code on Digital Silk RouteThe full source: React 19, Vite, Tailwind CSS 4, TypeScript. Host it anywhere and change anything.
$5one payment
Buy theme · $5 - XOXI themeA theme for your XOXI profile. Live on the XOXI website now; the iOS and Android app gets it with the next app update.
Includedfor Business+ members
Get it with Business+ plan on XOXI
Want to see it first? View demo
More templates
Others you may like
Pagina
A multi-page portfolio template for independent designers and small studios, with light and dark mode.
Free on Framer · $5 code
Stint
A multi-page resume and CV website with a career timeline, a printable resume page, and light and dark mode.
Free on Framer · $5 code
Sidelit
A multi-page photography portfolio where the photograph in view lights the page, with every frame shown whole and light and dark mode.
Free on Framer · $5 code
Want one made for you?
Start with a free 30-minute call. You get a written plan and a fixed quote before any work begins.
Fixed quote. You own everything we make.
