Deli Paper is the look I share across aakashreddy.com and every app I ship.

One white card on a sheet of checked deli paper, Manrope throughout, warm greys and a single hand-drawn highlight.

Each app keeps the system and changes only the paper’s colours.

The tokens, components and files here are the ones the sites load.

Sites

  • aakashreddy.com

    aakashreddy.com

    My portfolio: projects, posts and how to reach me

    Black and white checks, a red highlighter behind the one line that matters.

    deli-ink #111111deli-paper #f7f7f7
  • splitova

    splitova

    UPI bill splitting that reads payment alerts on your phone

    A ledger of pastel green and red checks printing + and − amounts that count up. The highlighter is ink.

    ledger-credit #bae0c4ledger-debit #f4c9c3
  • mhook

    mhook

    Custom webhooks to answer servers and agents by phone

    Pastel blue on cream, with a blue highlighter in hook-accent.

    hook-ink #b3c8f1hook-paper #f9f5ed
  • spek

    spek

    In-browser TTS reader with WASM voices for PDFs and articles

    Neon lime softened to a pastel on cream. Its buttons and highlighter are its neon #d9ff63, with dark ink on top.

    lime #dbf299cream #f9f7f0
  • holey-shapes

    holey-shapes

    Seeded, math-based SVG avatars with holes that open on hover

    The portfolio’s black and white checks, with a small holey centred in every square. Their holes close and reopen as the pointer passes.

    deli-ink #111111deli-paper #f7f7f7

The idea

  • One card on one sheet. Every page is a Card on a Paper. Everything readable goes on the card; nothing sits straight on the paper. The card is square; the paper never moves.
  • The paper is the app's colour. The portfolio's paper is black and white (deli-ink, deli-paper). splitova's is a ledger of pastel green and red checks printing + and − amounts that count up (ledger-*). mhook's is pastel blue on cream (hook-*). spek's is neon lime softened to a pastel on cream, and its buttons and highlighter are its neon #d9ff63 with dark ink on top. holey-shapes keeps the portfolio's black and white checks and centres a small holey, in its shape's own colour, in every square; their holes close and reopen as the pointer passes, in a wave when the page opens, and in a ripple from a click on the paper. A new app gets its own two colours, added as <app>-ink and <app>-paper, and nothing else changes.
  • Type does the work. Headings are light (title, weight 400); body is a heavy-ish 500 at 20px. No icons, no illustrations, no gradients, no shadows except under phone screenshots.
  • One mark per page. A Marker behind the one line that matters (a red stroke on the portfolio, ink on splitova, blue on mhook). Never more than two.

Writing

  • Write plainly, in first person on the portfolio ("I [used to] work as a Software and Systems Engineer for Lloyds bank") and second person on the apps ("Pick one, tap Split, and the expense opens already filled in").
  • Sentence case everywhere: headings, buttons, nav. Headings are one or two nouns: "Now", "Projects", "Ways to answer".
  • Lowercase product names, as their owners write them: splitova, mhook, suitecut, holey-shapes.
  • Project one-liners are technical and concrete: "C++ CEF browser engine that agents drive, record and stream". Name the mechanism, not a benefit.
  • Money is rupees with Indian grouping and a sign: +₹1,240, −₹1,380. Write the sign even when colour shows it.
  • No emoji, no exclamation marks, no "simply" or "just".
  • Links to other sites open in a new tab. The site's own links (nav, sections, pages) and email links such as "Get in touch" open in place. TextLink and Button do this for you; elsewhere, add target="_blank" rel="noopener noreferrer" or the click listener in TextLink's README.

Using it in an app

  1. Load tokens.css, the Manrope font, components/bundle.css, React 18 and components/bundle.js; the components are on window.DeliPaper.
  2. Render Paper with the app's colourway, then one Card holding a Masthead, a Hero with Phones, and Sections of Columns, Rows and text.
  3. Without React, call DeliPaper.mountPaper(element, 'ledger') and use the dp-* classes from bundle.css directly.

Deli Paper, version 1. Tokens taken from the portfolio and splitova on 29 October 2026.