Intro to The 8-Point Grid System
Elliot Dahl
5.8K91

Hi Elliot, thank you for sharing.

I read this post a few months ago when I started as a product designer. At that time, I was feeling very confused as this seems like a set of rules for me in order to keep consistency. So I turned to a few other designers to ask them wether they followed 8pt design system, but the answer was no.

But after spending some time in the industry, now I realized that this is not something that we have to follow, but it can be a good starting point to do this for less effort and time to keep the design look concise and consistent. It is OK to use a 20px gap instead of a 24px as long as we can keep it through the system.

I also read the second part about the border. Thank you so much for digging that deep into details and suggest consulting with developers. As the design team of one, I already feel the frustration of needing to considering every padding and margin every time, so this 8pt system might be a good starting point for me.

And I have a question. Do you pre-define the margin and padding? What if you come across some cases later that the font size turns out to be too big/small? The gap between two paragraph looks too much in some places? Do you have any suggestions for this? Thank you!