Vertical rhythm in web apps?

over 1 year ago from , UX designer

Hi everyone,

I was wondering if anyone had any examples of complex web applications achieving a consistent vertical rhythm, and how you'd achieve that.

Any help is greatly appreciated!

P.s I'm not interested in type-heavy websites like blogs or whatever, it's got to be something relatively complicated with lots of elements other than text.

Thank you!


  • Chinmay Kulkarni, over 1 year ago

    If you're not talking about type-heavy websites have you got any examples of what you're looking for? (First time hearing about vertical rhythm, I'll definitely look into it some more).

    1 point
  • Dexter W, over 1 year ago

    As you probably realized, vertical rhythm becomes a lot more complex with web apps because usually you don't have walls of text, but components, tables, grids, labels, etc some of which are dynamic. I found that a lot of those CSS rules/mixins for marketing layouts don't necessarily translate over well.

    Try thinking about how the rhythm works in respect to how each component behaves with each other, and look at typical vertical rhythm for blocks of text in isolation. I don't think there's an easy way - as you build out a design system you start to see pairings that you can repeat.

    0 points