Every premium and members-only resource for $9.99/month, as a no-commitment subscription. See the plans

PalateKit

Menu

Request a resource

Describe the resource you are missing in one sentence. We will email you when it is published.

0 / 280

Unlock PalateKit

Unlock everything

Plan

Paying means accepting our terms of sale.

Secure payment by Stripe. Receipts and invoices sent by email.

Welcome back

Sign in to install, download or save this resource. A free account is enough for free resources.

Warm cream paper with an olive accent v1.0.0

Use this resource to give a site or app a calm cream-paper style with an olive accent

New

  • 184 downloads
  • 37 likes
  • 102 saves

Free

Install with the CLI

In a terminal, from the folder you want:

npx --yes palatekit@latest install granola-warm-paper-notes

First time: connect the CLI with

npx --yes palatekit@latest login

The agent reads this DESIGN.md and applies the granola.ai style: a warm off-white background, an olive accent, serif headings and near-invisible shadows. It draws on the colors, fonts, radii, shadows and component rules to build your pages. You get a consistent design with do and don't rules, instead of starting from a blank page.

Mostly picked by

Updated November 2, 2026

Warm off-white, dark ink and olive palette with serif headings

Details

Generates with
Your agent's model
Licence
MIT

Similar resources

View all

What you get

  • DESIGN.md: the full design system
  • The color palette with each tint's role
  • Typography, shape and shadow rules
  • A prompt guide ready to hand to the agent

Good fit for

  • a notes, writing or productivity tool
  • a calm editorial site built around reading
  • a brand that wants a crafted, analogue feel

Not for

  • a dark or neon interface
  • a very colorful or high-energy site

Tags

  • paper
  • warm
  • olive
  • serif
  • notes

About

You say

"Read DESIGN.md and build my site's home page in the granola.ai style."

Warm off-white, dark ink and olive palette with serif headings

DESIGN.md published by educlopez under the MIT license.

Show more

Prerequisites

You bring
Your page content (copy, images) and Your logo and brand colors if you adapt the style

How to use it

  1. Copy DESIGN.md to the root of your project.
  2. Ask your agent to read it before building the interface.
  3. Describe the page you want and adjust colors and fonts to your brand.

Content preview

Files

  • DESIGN.md6.6 KB
  • LICENSE1.1 KB
  • NOTICE-PALATEKIT.md0.4 KB

Origin and licence

Modified by PalateKit

Author
educlopez
Source
github.com/educlopez/design-bites/tree/754ddd2934531744e841bf1fd95194b16dc28d21/design-mds/granola.ai
Licence
MIT

Notice

Version modifiée de « granola.ai » (educlopez, MIT) : traduction française et fiche par PalateKit.

User reviews

–

No ratings yet

Loading reviews…

Delete your review?

Your rating and comment will be removed from the page.

Frequently asked questions

How do I install it?

Place DESIGN.md at the project root, then ask your agent to follow it for any interface work.

Do I need the original fonts?

Quadrant and Melange are the brand's own typefaces: swap in a free serif and sans-serif if you do not hold the license.