luis.

@disco_lu

5 Tweets • 2023-05-02 •  See on Twitter

rattibha.com 

Everyone loves the 4px grid for spacing, but what if we

tried something new?

"Designs all look the same nowadays" could be

because we all approach spacing the same, so maybe
we can shake things up a little with a new way to
handle it

The Fibonacci spacing system, maybe?

In the 4px system, we space like this...

A base unit of 4, then multiple it by 1 (or x.5 if we're

being funky) to get our system:

2 (0.5x)
4 (base)
8 (2x)
12 (3x)
16 (4x)
20 (5x)
24 (6x)
etc
But the Fibonacci system would work by adding the
two previous values together:

1
2
3
5
8
13
21
etc

It's definitely...odd, but there's something here I like

Here it is on a few components: a pill, a button, and a
card

The differences are minor, but feel like we're getting

spacing a lot tighter, which somehow feels a bit more
polished and refined? I dunno

https://video.twimg.com/ext_tw_video/165

3396786839539719/pu/vid/720x360/tUa4EPk5

KhRbUZ2U.mp4?tag=12
And on the card without any notations to see how
subtle the differences are

https://video.twimg.com/ext_tw_video/165

3397178960707586/pu/vid/720x360/4xwkLo5F

xgavGieH.mp4?tag=12

These pages were created and arranged by Rattibha

services (https://www.rattibha.com)
The contents of these pages, including all images,
videos, attachments and external links published
(collectively referred to as "this publication"),
were created at the request of a user (s) from
Twitter. Rattibha provides an automated service,
without human intervention, to copy the contents of
tweets from Twitter and publish them in an article
style, and create PDF pages that can be printed and
shared, at the request of Twitter user (s). Please
note that the views and all contents in this
publication are those of the author and do not
necessarily represent the views of Rattibha. Rattibha
assumes no responsibility for any damage or breaches
of any law resulting from the contents of this
publication.