no-code.supply

Portfolio

Tinta

A colourful portfolio for an illustrator or art director where every project brings its own colours, and the whole page takes them

Tinta is a portfolio for an illustrator or art director whose work is colour. It is flat printed-ink colour on warm paper, set in one squeezed, heavy typeface. Home opens with a big plain headline and a portrait, then five case studies as a mosaic of cards, each in its own palette: hover or focus one and the whole page turns its colours. Below sit four rows of what she makes (each hovering in a case's colours), an Off the clock section with a studio photo and four short notes, and a vermilion contact block with a copy-email button. The Work page holds all twelve projects (five cases and seven archive pieces as flat colour cards) and can be browsed by discipline and by colour, as a mosaic or a list, with the filters kept in the address. Each case has its own page set entirely in its three colours: the brief, what was made and how it landed, a palette strip that copies its hex codes, three images, the client's words and a block already in the next case's colours. Also a 404 and a privacy page.

Live demoFramer preview
Choose your edition
Buy — $69, Tinta Bundle — HTML + React

Tax included · Checkout by Polar

Digital product · All sales final · Refund policy

Screenshots

  • Tinta template — desktop screenshot 1
  • Tinta template — desktop screenshot 2
  • Tinta template — desktop screenshot 3
  • Tinta template — desktop screenshot 4
  • Tinta template — mobile screenshot 1
  • Tinta template — mobile screenshot 2

Signature effect

Every project brings its own colours: hover or focus a project and the whole page takes its three-colour palette in a 220 ms re-colour (instant with reduced motion); its case page is set in them, the Work page can be browsed by colour, and each case's palette strip copies its hex codes. Each palette is one class in tokens.css

Installation

Up and running
in minutes.

No accounts, plugins or build tools. The HTML edition runs straight from the folder you download, and the React edition is a standard Next.js project.

  1. 01

    Unzip

    Download the zip after checkout and unzip it anywhere.

  2. 02

    Open index.html

    Double-click it and the site opens in your browser. Change the text in any text editor, save and refresh.

  3. 03

    Drag it online

    Drop the folder onto Netlify or Vercel, or upload it to any static host. It takes about a minute.

Edition

tinta-html-1.0.0

  • index.htmlDouble-click to open
  • assets/CSS, scripts, fonts, images
  • README.mdEditing and deploying
  • DESIGN.mdColours, type, spacing
  • AGENTS.mdFor your AI assistant
  • LICENSE.md

Pages

  • Home
  • Work
  • Case study
  • 404
  • Privacy

Fonts

  • Bricolage Grotesque

Who it suits

  • Illustrators
  • Art directors
  • Packaging and brand designers
  • Muralists and sign painters
  • Any creative whose work is colour

Palette

  • #FFF4E6
  • #24102E
  • #FF4F2E
  • #FFC933
  • #3B2BFF
  • #FF9FCB
  • #0E9F6A

Changelog

  1. v1.0.02026-10-27
    • HTML edition: static pages, no build step, works from disk. The page re-colour and the Work filters are two small scripts with settings blocks; every project's palette is one line in tokens.css.
    • React edition: Next.js 16 static export with the same pages, copy and behaviour; all copy in content/site.ts, case pages from one dynamic route.
    • Pages: home, work (twelve projects, filter by discipline and colour, mosaic or list), five case studies, 404, privacy.
    • The case page (case.html?p=<slug>) is now a real page per project: work/sazon.html … in HTML, /work/sazon/ … in React. The concept's unknown-slug fallback to the first case is gone; an unknown address gets the 404.
    • Cards, list rows and case pages are written into the HTML instead of being drawn by JavaScript from a data array, so every page is complete without JavaScript (the Work page then shows all twelve projects as a mosaic, and the filter bar hides).
    • Project colours moved from inline styles and a script array to one .p-<slug> class per project in tokens.css; the page re-colour now swaps a class on <body> instead of setting four custom properties.
    Show all notes
    • Archive cards keep one shape each. The concept handed shapes out by position in the filtered list, so a card's shape changed when you filtered.
    • The What I make rows take their colours from a case's palette class instead of separate values (same colours).
    • The image placeholders (a coloured plate with the file name, shown until an image existed) are gone; the images ship with the template, with 1000-px copies for phones.
    • Footer: a Privacy link next to Back to top. Added 404 and privacy pages.
    • Under 760px without JavaScript, the header keeps its three links instead of showing a Menu button that couldn't open.
    • Work page card titles are h2 (they were h3 under the page's h1). The case page quote is a <figure> with a <figcaption> instead of a <footer> inside the <blockquote>.
    • Self-hosted Bricolage Grotesque instead of Google Fonts; favicon, Open Graph image, apple-touch icon, web manifest and JSON-LD added.

Questions

HTML if you want a site that runs straight from the folder, with no build step. React if you already build in Next.js. The bundle gets you both, for less than buying them apart.

The license page spells out what a purchase covers, including client projects.

Read the license

No. It's a digital product, delivered as soon as you've paid, so all sales are final. If something doesn't work as described, email contact@no-code.supply.

Read the refund policy

No. A new version of a template you've bought is a free download from your Polar account — see the changelog below for what changed.

Mostly, yes. In the HTML edition you change the words and images in any text editor, save and refresh. The README and DESIGN files show where the colours and fonts live.

Drag the folder onto Netlify or Vercel, or upload it to any static host — no build step for the HTML edition, or a couple of commands for the React one.

As a remix link, right after checkout and in your Polar customer portal after that. It copies the whole project into your Framer workspace: pages, CMS collections, code components and the Framer Skills that teach Framer's agent how the site is built.

Yes. All-Access includes every template's Framer edition, alongside the HTML and React editions. On its own, it's sold by itself or with both code editions in the HTML + React + Framer bundle.

Related

  • Ashlar template — cover

    Ashlar

    Real estate
    • HTML
    • React
    • Framer

    Ashlar is a website for a boutique real-estate office that sells a few exceptional houses by introduction. It has five material slabs that open into exterior photographs, a register with an index of houses beside one house sheet (photo switch, facts, and buttons to the house page and the introduction form), a page per house (facts, photographs in a lightbox, a longer story and the advisor who shows it), a draggable terrace view with bearing marks and a dial, a three-step method with a timeline, advisor cards with live local times, and an introduction form that writes a letter as you type.

    Libre Caslon Display / FigtreeFrom $19
  • Aurel template — cover

    Aurel

    Brand
    • HTML
    • React

    A quiet, clay-and-bronze skincare template for a Copenhagen barrier-repair brand: a raymarched WebGL serum drop that bulges toward the cursor in the hero, a three-step ritual with CSS-rendered bottles, an ingredient list with generated molecule diagrams, a draggable before/after hydration map, clinical-result stat cards and a working shop with size pickers and a bag.

    Bodoni Moda / JostFrom $19
  • Cistern template — cover

    Cistern

    Product
    • HTML
    • React

    Cistern is a launch site for a residential energy-storage product, with a drawn graphite slab and its seam of light, a draggable 24-hour instrument that reads roof, house, battery and grid, a self-sufficiency calculator that suggests a model, three model cards, a FAQ and a free-survey request form.

    Jost / Inter TightFrom $19