Offscript: Independent creative studio website template for Next.js.

$39one-time payment

Buy OffscriptLive demo

Checkout opens soon.

  • Next.js 15
  • CSS
  • TypeScript
  • 8 sections
  • Light
  • No API keys
  • Updated Oct 10, 2026
Live demo
The Offscript landing page template on desktop, from the hero to the footer

Overview

A complete studio website for independent brands and creative partners. Its own working-wall identity ties together a photographic contact sheet, three concept campaigns, typographic capability posters and a process composition that moves from question to exploration to finished creative.

Made for
Independent creative, brand and social studios, Campaign production and creator agencies, Design partnerships with a strong editorial point of view
Highlights
  • An expanding contact sheet with frame-specific captions and keyboard or touch exploration
  • A compact numbered index and three full campaign stories
  • One creative world assembled through three physical process stages
  • Open engagement rows, two notebook articles and a locally hosted variable font
The look
Warm paper, black ink, acid yellow and lilac, with locally hosted Manrope. A large typographic opening, a dark photographic contact sheet, a wide flagship campaign and staggered portraits, an ink studio chapter, typographic posters, a lilac process wall and taped notebook covers. A compact numbered index replaces the conventional central navigation bar.

Sections

  1. 01

    Hero and contact sheet

    A two-line studio promise with a traced highlight. Three photographs expand as you explore them; the crop, caption and focus details follow the selected frame. Works with pointer, keyboard and touch.

  2. 02

    Studio index

    A compact fixed Index button opens a numbered directory. Closes on selection, outside click and Escape, returning focus on Escape.

  3. 03

    Creative worlds

    One wide campaign and two staggered portrait directions, each linked to a complete story with the question, direction, making and creative takeaway.

  4. 04

    Studio and capabilities

    An editorial belief on an ink background, a studio photograph with a paper annotation, three principles and three illustrated typographic capability posters.

  5. 05

    Working wall

    The same campaign moves from a paper brief to a moodboard of type, colors and imagery, then becomes a finished frame. Three stage buttons and a keyboard-accessible range input share one state.

  6. 06

    Engagements

    Two open rows for campaign and partnership work, with correct project/monthly fee labels and direct inquiry links.

  7. 07

    Notebook

    Two paper article covers lead to full essays about creative strategy and building a campaign world.

  8. 08

    FAQ and invitation

    Native disclosures, a pencil-marked typographic invitation and a compact footer with configurable contact and social links.

Remove a section by deleting its line in app/page.tsx, or move the line to reorder.

Make it yours

Brand, copy and destinations live in site.config.ts; campaign and article content have their own small data files.

Where to change each part of Offscript
To changeEdit
Brand, metadata, URL, section copy, fees and FAQssite.config.ts
Email, booking and social destinationssite.config.ts → links
Campaign stories, names, images and page slugsdata/projects.ts
Notebook articles and slugsdata/notes.ts
Palette, type and section compositionstyles/ and app/layout.tsx
Selected hero frames and process artworkcomponents/ContactSheet.tsx and components/ProcessCanvas.tsx
Page orderapp/page.tsx

Run it

$ npm install$ npm run dev

Node.js 20.9 or newer. No environment variables.

Before you go live

Replace the fictional brands, concept campaigns, articles, example fees and illustrative studio subjects with your own material. Set url, email and booking links in site.config.ts. Campaigns are creative studies, with no invented client results.

Specifications

Framework
Next.js 15 (App Router), React 19
Language
TypeScript
Styling
CSS with design tokens and component styles
Fonts
Manrope (local variable font), self-hosted with next/font
Dependencies
next, react, react-dom
Images
Four original AI-generated illustrative photographs, optimized as local WebP. Original SVG mark and pencil strokes; CSS and React process artwork.
API keys and environment variables
None
Node.js
20.9 or newer
Colour scheme
Light
Responsive
Desktop, tablet and phone
Accessibility
Skip link, visible focus, keyboard navigation, reduced motion
Deploys to
Vercel, Netlify, Cloudflare Pages or any Node host
Codebase
54 source files, about 4,100 lines
Last updated
Oct 10, 2026

License

One license, no tiers. The full text ships as LICENSE.md in the download.

You can

  • Use it for your own products
  • Use it for any number of client projects
  • Change the code and design however you like
  • Deploy the result commercially

You can’t

  • Resell or share the files as a template, theme or UI kit
  • Publish the source as a template in a public repository

Questions

What do I get when I buy Offscript?

The complete Offscript project as a download: the Next.js app, its config file, a README with setup and customisation notes, and the license. The download link arrives right after checkout.

Can I use Offscript for client projects?

Yes. One purchase covers your own products and any number of client projects, and you can change the code however you like. What you can’t do is resell or share the template files themselves as a template or UI kit.

Do I need API keys, a database or a backend?

No. It runs with npm install and npm run dev and deploys to Vercel, Netlify or Cloudflare Pages without any environment variables.

What should I change before I launch?

Replace the fictional brands, concept campaigns, articles, example fees and illustrative studio subjects with your own material. Set url, email and booking links in site.config.ts. Campaigns are creative studies, with no invented client results.

Do I need to know Next.js?

Basic React helps, but most changes are text edits in site.config.ts. The README walks through colours, fonts and section order.

How do updates work?

Updates to Offscript are free. When a new version ships, download it again from the link in your order email.

Can I get a refund?

Yes. If Offscript isn’t right for you, reply to your receipt within 14 days and you get your money back.

Should I buy all-access instead?

If you’ll use more than two templates, yes. All-access is $99 for all 37 templates, including Offscript and every template added later. Three single templates would cost $117.

All-access

All 37 templates for $99.

Every template in the library, including Offscript, and every one added later. Same license, free updates. Less than three single templates.

Get all-accessBrowse the library
  • Tandem
  • Offscript
  • Plumb
  • Inlay
  • Tessera
  • Aveniq
  • Turnout
  • Bounce
  • Oddline
  • Goodfolk
  • Daymark
  • Encore
  • Shear
  • Notch
  • Serein
  • Rivet
  • Vela
  • Sylva
  • Aster
  • Arclo
  • Daybreak
  • Conduit
  • Index
  • Footnote
  • Cutroom
  • Halftone
  • Emberline
  • Influence
  • Marlow
  • Parley
  • Fourteen
  • Kept
  • Stillform
  • Prism
  • Tempo
  • Patch
  • Relay