KANTO DS v1.12.0
Customise

Theme

Accent

Font

Corners

Density

Text size

Reset to Kanto
Templates

Portfolio

GitHub Copy link

A person's work: projects to filter, case studies, a career, writing and a contact form.

Demo

Live demo
Portfolio

The frame is the template itself, running. Everything in it works.

What to try

  • Filter the work by a tag, then back to everything.
  • Open a case study, close it, open another: the panel follows.
  • Send the contact form empty first: each field says what it needs.

Start a project

npm create kanto@latest my-app -- --template portfolio --stack react

Or fork it as it is, without the tool:

npx degit MrArnaudMichel/kanto/templates/portfolio-react my-app

What is inside

Rowan Ellis's site, on one page: an introduction, a few numbers, selected work to filter — each project opening into a case study with its outcomes and its phases — a career on a timeline, writing, and a contact form that says what is missing before it sends.

Everything it says is in src/content.ts; the filter and the checks are in src/work.ts.

Route What it shows
#work, #career, #writing, #contact The sections, reached from the header.
To change first What it holds
src/content.ts Everything the site says.
src/brand.ts The brand, in one call.
src/actions.ts The form and the CV. Call your form service here.
src/work.ts The filter and the checks.

Components