Skip to content

About Art of Styleframe

Art of Styleframe is an independent design publication. We write about UI design, layout systems, typography, motion for web, design tools, and creative direction. Every guide comes from real production work: the HTML and CSS we've shipped, the cross-browser bugs we've debugged, and the front-end details that only surface once a design has to run in a real browser.

We don't cover branding theory, print design, or illustration. Our focus is the web: how interfaces look, how they move, and how designers hand them off to developers without losing fidelity.

Who Edits What

Portrait avatar of Mira Telos

Mira Telos Editor, UI & Layout

Mira covers the UI and layout side of the publication, design tokens, component variants, type scales, dashboards, and the unglamorous CSS work that makes a layout hold up at every breakpoint. She tends to argue for the small, boring decision: name your tokens before you draw the screen, write the component API before you place the props panel.

Her articles favour practical examples over abstract principles. If a property only works in two browsers, that goes in the first paragraph. If a Figma workflow saves an hour a week, it gets the screenshot.

Portrait avatar of Roan Vesper

Roan Vesper Editor, Motion & Visual

Roan writes about motion, web animation, brand systems, and the visual edges of a design, easing curves, scroll choreography, the moment between a click and a state change. His pieces lean on the idea that shipped animation beats perfect animation, and that motion should serve the content rather than draw a circle around itself.

Topics he keeps coming back to: timing functions that aren't ease-in-out, kinetic typography that actually reads, and the difference between a transition and a story.

The Bar for Publishing Here

  • Where we haven't used something ourselves, we say so and point to the sources. We don't present research as experience.
  • Code examples are tested in current browsers before publishing. No theoretical snippets.
  • Tool comparisons name their sources and say when a claim comes from documentation rather than our own use, not feature matrices copied from marketing pages.
  • We include version numbers, browser support data, and dates. Design advice ages fast, we want you to know when ours was written.
  • No sponsored articles. No paid reviews. No affiliate links on tool recommendations.

What we cover

  • UI Design, visual hierarchy, color theory, spacing, layout composition
  • Design Systems, Figma components, tokens, documentation, team workflows
  • Web Layouts, CSS Grid, Flexbox, dashboards, responsive patterns
  • Motion Design, web animation, transitions, scroll-driven effects, micro-interactions
  • Typography, font pairing, type scales, readability, web font performance
  • Tools, Figma, Sketch, Penpot, and the ecosystem around them

Contact

Questions, corrections, or collaboration proposals: hello@artofstyleframe.com