Opennote

Opennote

Preview image. Unlock full-res

ink on parchment

Industryproductivity
Palette
#fffdf8
#0a0a0a
#474747
#8c8c8c
#e5e5e5
#d1d1d1
#512906
#242d64
#0c3b1a
#5e0831
#ffc934

Opennote employs a minimalist, paper-like aesthetic featuring a high-contrast typographical hierarchy set against a soft, near-white canvas. Subtle border treatments and distinct, functional button styles define interactive elements. Color is used sparingly, primarily for accent and to distinguish action states, creating moments of focus within an otherwise calm and content-centric design. Prioritize IowanOld for all headings and display text to deliver a traditional, thoughtful voice. Use SuisseIntl for all body text, button labels, and navigation to maintain readability and a clean feel. Apply Parchment (#fffdf8) as the dominant background color across all pages and main content areas. Use Burnt Umber (#512906) exclusively for primary action buttons to clearly signpost key interactions. Employ Ink Black (#0a0a0a) for all primary text and critical UI elements to ensure high contrast and legibility. Define UI boundaries and elements with subtle Whisper Border (#e5e5e5) 1px solid borders, avoiding heavy lines. Maintain a consistent 10px border-radius for all interactive components and cards to soften edges uniformly. Do not introduce new serif fonts beyond IowanOld, as it would dilute the typographic identity. Avoid using highly saturated colors for background elements; reserve saturation for functional accents and brand highlights. Do not use heavy shadows or gradients on interactive elements; prefer solid color fills and subtle borders. Do not deviate from the Parchment (#fffdf8) background color for core content sections; alternative backgrounds should be used sparingly and only for distinct sections. Avoid excessive use of colors like Blue Violet, Forest Green, or Crimson Blush in body text; reserve them for decorative accent blocks or specific highlighted elements. Do not use less than 12px padding around clickable elements; maintain a comfortable tap/click target. Avoid text colors with insufficient contrast against the background; always prioritize Ink Black or Slate Gray for readability.

More like this