Загрузка видео...
Не удалось загрузить видео
A German tweeting about grids … oh well here goes nothing: Every component here follows a very simple and layered grid structure. First 8px base grid. I set that up as tightly as possible to allow for max flexibility later. 24px radius + Inset 24px Second padding (safe space)... show more
98,212 просмотров • 7 дней назад •via X (Twitter)
Комментарии: 24

Are these constraints things that you are just prompting, setting up in Figma initially, using md files, or a mix?

Good question - this time I will say I didnt use a canvas tool at all. It was just a lot of quick back and forth with the LLM

Sweet thanks! Looks great

free alpha here

Kannst du deine dms checken pls?👀

It’s just how we’re wired 🇩🇪

I cant help it! They used to make us draw grids by hand in design school in germany. 😂🇩🇪

Still would love to see a sample prompt and context you used to generate one of those.

This is also why grid systems work so well with coding agents. “Make it cleaner” is subjective; an 8px base grid and three type sizes give the agent constraints it can test.

Don’t you think to write such instructions as SKILL.md?

really cool, need to experiment with this, I just watched a thing from John Bai showing abit about his process using Figma MCP and Grok Bot to speed up seeing iterations

nice touch with the details

Astra says: Why Germans love grids: "It is a century of treating order as courtesy. DIN, the German standards body, has normalized paper (the A4 you use is DIN 476 from 1922) and lettering (DIN 1451) since 1917. The Bauhaus made design an engineering discipline, the Ulm School and Otl Aicher's 1972 Munich Olympics system turned the grid into a public language, and Dieter Rams at Braun made restraint the brand. The grid is a promise to the next person that the work will be predictable. Japan's version is process rather than layout: Toyota's kanban and the bento box, which is where "bento grid" tiles come from. Marvin's post is that tradition applied to LLM output, and it works because constraints are what a model can hold consistently."

This was very helpful, thank you 🙏

I like the constraint-first approach. Green checks can lie, so I still check the deployed path where the spacing has to survive real content.

does the 3 sizes rule survive nested components?

jospef müller-brockmann would be proud

Love the structure! So somehow it's still things only designers know

One thing I always look at is visual hierarchy. If everything is competing for attention, the viewer doesn't know where to look first.

Nice!

Right now I don’t have any constraints and I really want to learn how it works! Could you give me some insights of how to learn those, the keywords to search?

I bought a domain why I got obsessed with grids called

Is this open source?

8px grid nerds unite lol
