08 · Library
Patterns
The system, assembled. Not a component inventory, these are complete surfaces you’ll reach for when building dashboards, pages, emails, or posts. Read them as reference, copy them as a starting point.
Dashboard fragment
Three metric tiles, one title bar. Tabular figures, plain-English direction in muted text, no color-coded up/down arrows. Suitable for internal tools and status pages.
This week
Active projects
12
+2 since last week
Newsletter subs
1,248
+24 last 7 days
MRR
$8,400
Flat
Used in: internal tools, project dashboards, status pages.
Landing hero
The canonical shibin.co opening: a quiet General Sans greeting, a direct headline, one paragraph, and two underlined text actions. No decorative background or ornamental type is needed.
Hey, I’m Shibin.
I help Shopify brands
grow with AI.
I build AI agents, write a newsletter for Shopify operators, and ship a handful of small internal tools. This site is where all of it lives.
Used in: shibin.co homepage and focused personal landing pages.
Project grid
Three restrained project cards. Each uses small Manrope metadata, a General Sans title, and a short description. The border is the structure; there is no decorative color block or background pattern.
AI · Shopify
Shopify AI Hub
A living index of AI tooling built for Shopify operators. Weekly updates.
Newsletter
Field notes
Short letters to operators on what’s working with AI in commerce. 1,248 readers.
Tools
Internal ops deck
A small set of utilities I use to keep client work moving without context loss.
Used in: homepage featured work, project indices, archive pages.
Outbound notes, newsletter issues, client updates, and personal replies. General Sans carries the message; Manrope is limited to sender and date metadata. The subject carries the hierarchy.
Shibin Dotco <hi@shibin.co>
A small note on quiet hierarchy
Quick thought this week. The clearest interfaces I use do less to announce their structure. The title, spacing, and order of information tell me where to look.
That’s the move I’m keeping here: white canvas, graphite type, thin gray borders, and actions that read like text. Nothing competes with the work itself.
Shibin
Used in: newsletter issues, client updates, transactional emails.
Blog spread
Article opening with a label, title, Manrope date and read time, a thin divider, and a comfortable reading column. Editorial hierarchy comes from type and space, not ornamental flourishes.
Essay · Craft
Hierarchy without decoration
A page feels considered when the order is obvious before any decoration arrives. The heading establishes the subject. Metadata steps back. Body copy gets enough width and air to be read without effort.
The constraint is simple: white canvas, graphite type, a small neutral palette, and one type family for the voice. Manrope appears only where metadata needs its own quieter texture.
This is the version of that hierarchy I hand to agents and collaborators, so every new surface starts from the same calm baseline.
Used in: long-form posts, essays, case studies.