No. 53 of 106
The writer’s card under a story.
Put a face and a story behind every article. Ten layouts from a slim byline to a speaker pass, seven skins, five photo shapes with spinning rings, a verified badge, “available for work” status, topics, numbers that count up, 18 profile networks and the author’s latest posts.
A fictional author, drawn for this demo. Every person on this page is made up.
The classic box at the end of an article: photo, verified name, what she writes about, numbers that count up, profiles in their brand colors and her three latest recipes with thumbnails.
Maya writes simple, seasonal recipes for busy weeknights. Before cooking full time she ran a small supper club, and she still tests every recipe three times before it goes live.
The slim strip that sits under an article title: who wrote it, their role, a verified badge and a follow button, in one line. On narrow screens it wraps neatly.
Moving two million accounts without anyone noticing took eight months, a lot of rehearsals and one very long Sunday night. This sample article shows where a byline strip sits in a real post…
Aiko writes about color, design systems and the small decisions that make interfaces feel calm. She has led design at two start-ups and now runs workshops for product teams.
A colorful cover banner with the photo overlapping it, a spinning gradient ring, numbers and the writer’s most popular articles as small cards. Great for contributor and team pages.
A big photo on one side, and a clear “available” status, location and two buttons on the other. Status can be available, busy or away, with a matching dot on the photo in the other layouts.
Paige helps young companies find a clear, confident voice: naming, positioning and the words on their website. Fifteen years in agencies, now working directly with founders.
About, Articles and Connect in one compact box. A gradient line slides between the tabs, the article count sits on the tab, and arrow keys move between them for keyboard users.
Kofi looks after the build pipeline and writes most of our guides on deployments and on-call. He likes boring, reliable systems and very clear runbooks.
The quote layout leads with the author’s own words in large serif type, with a handwritten signature and the author beneath. Shown here on the dark skin.
The best trips I have taken were the slow ones: fewer places, longer stays, and time to notice the light change over the same street every evening.
The ID card layout looks like a lanyard pass: slot, event name, photo, topics, numbers and a barcode. Here are three speakers in three skins.
A colored side panel holds the photo, name, status and profiles; the story and latest trips sit beside it. On narrow screens the panel becomes a banner on top.
Leo has spent ten years traveling by train and ferry, writing guides for people who would rather see one city well than five in a hurry.
Newsletter sign-off · centered profile · gradient skin
Short notes on the people and tools behind small, independent websites. No ads, unsubscribe any time.
Literary essay · minimal · no card
…and that is why I still keep a paper notebook in my coat pocket. Some ideas only arrive when there is nothing to scroll. (End of a sample essay.)
The same author in every skin. The animated gradient border is the knowledge-base box above.
White · skin = white
Soft · skin = soft
Glass · skin = glass
Dark · skin = dark
Circle, rounded, squircle, hexagon and a softly morphing blob, with solid, gradient, spinning, dashed or no ring, plus a status dot.
Soft, filled, outline, plain or a pill with the name, each with an optional brand-color mode. Email links open the mail app; the rest open in a new tab.
106 elements for news, Author Box included.
NewsOn