Slopless Design

Northfold

About
/
Contact

Booking projects from June 2026

Start a conversation

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

Name

Your name

you@example.com

Message

Tell us a little about your project…

Send message

hello@northfold.com

Questions

How big are your projects?

Most run 8–16 weeks with a team of three to five people.

Do you work with startups?

Yes, from Series A onwards, when there's a product and paying customers.

Do you build the website too?

We design and build, then train your team to run it.

Where are you based?

Lisbon and London, working with clients across Europe and North America.

Can we hire you for a single deliverable?

Occasionally — a naming project or a sales deck. Ask us.

Slopless Design · reference render

Everything above this panel is the design

Design code sd1.hVVbDoIwELwQNVI1kW-5iMoqJgUbwai3d6YtSxM1ftJ9z8wudJwOUcIaMau63m1BDowfEvn7UC5sUW4Km0pr9gNaM2gyYaPvHPc-UMtUSuxfjfLEkkePfJ5vSRXleZ59bzyoCrwCbzW4IZwRoEvuAtxqa8crlkzwTRnlxKjLGT3FmpEQNTTiBfT3x5cZb8K65E7NVCwY5-8HrTUkBQhPmlA3aq1jcOBZnx9t2NDf3SJdFdNRFhkKF8ez0nluFXU0R4vz5gQ1IxjRuT7scl0ljbwB3R5R (Terminal Mono), drawn by the Slopless preview renderer with sample copy. Use it as a visual guide while building: design/DESIGN.md and design/tokens.json are the source of truth. Every section root carries data-pattern with its pattern id.

Viewport

Without ?viewport= the render follows the window width once scripts run. Screenshot at 1440 px with ?viewport=desktop and at 375 px with ?viewport=phone.

Tokens at a glance

Palette: monochrome, dark · bg #0B0F0C · text #C8D3C5 · accent #3DDC84
Type: JetBrains Mono / JetBrains Mono · scale 1.2, base 15px
Grid: 12 columns, gutter 16px, max 1100px · section space 51px
Shape: radius 0px · border dashed 1px · shadow none · motion subtle

Sections on the contact page (/contact), top to bottom

Each link shows that pattern alone with these tokens, beside its rule, grid areas, slots, notes and layout tree.

nav.terminal-statusline Status line · nav, on every pageOne line closed by a rule: the wordmark as a path (~/name) left, slash-separated links, a muted git-status meta on the right.
contact.terminal-mail-prompt mail prompt · contactA framed mail window: a title bar with the mail command, then a muted line, the form as prompt fields and the email address in the accent.
faq.terminal-help-flags --help flags · faqAn OPTIONS heading in bold capitals, then questions as flag rows: the question in the accent on 1–4, the answer on 5–12.
footer.terminal-exit-status Exit status · footer, on every pageA rule, then one line: a muted [process completed] status 1–4, slash links 5–9, legal 10–12.

Spec bundle (JSON): DESIGN.md, tokens.json and layout.json for this code
Terminal Mono style page: principles, do and don't, every pattern live
Open this design in the picker

To see the user's own copy, append the #b=… part of their picker link to this URL. It is read in the browser only and never sent to the server.