Estilo 06 · Modular

Bento Grid.

Inspirado nas caixas bento japonesas: informações organizadas em blocos retangulares e quadrados de tamanhos variados, perfeitamente alinhados em uma grade rígida. Cada bloco com seu próprio papel — como compartimentos de uma marmita perfeita.

Receita anual
R$ 2.4M
+24% vs ano anterior 2025
Usuários ativos
1.284
+12 agora
Plano atual
Pro+
Renova em 12 dias
Insight da semana
"Bento grids aumentam a leitura em 38% comparado a listas verticais."
Tarefas
Hoje
3 de 6
Revisar wireframes
Reunião com time
Atualizar styleguide
Publicar artigo 14h
Apresentação cliente 16h
Tocando
Bossa em Tóquio
Lofi Brasil
"
A grade é a base. A surpresa está nos tamanhos diferentes.
— Naoto Fukasawa
São Paulo
23°
Parcialmente nublado
Equipe online
+5
9 pessoas trabalhando agora
Convite
Comece sua trial grátis hoje.
02 · Anatomia

Por que funciona?

Hierarquia visual

O tamanho dos blocos define automaticamente o que é mais importante. Blocos maiores carregam destaque, menores complementam.

Ritmo modular

A alternância entre quadrados e retângulos cria um ritmo visual que mantém o olhar engajado sem cansar.

Adapta-se ao mobile

CSS Grid permite que os blocos reorganizem-se em coluna única no celular sem perder a coerência.