Skip to content
KansoMakado design system 1.1
makado.app

Showcase

AppScreens

The home screen, composed only from Makado components and the Makado logo.

Preview

Live, in this page’s themeOpen on its own

Guidelines

The home screen, composed only from Makado components and the Makado logo. It is built to scan in four blocks, top to bottom.

  • App frame: the logo lockup above the SideNav on background-base; a top bar with a search TextField, a quiet bell ActionButton with a count, and the user's Avatar.
  • Greeting: PageHeader with the date, a one-sentence status and the one accent Button (New project).
  • Numbers: four StatTiles. Only Overdue colors its icon.
  • This week: a KanbanBoard with one column per day, today first and highlighted. Every card shows its status (To do, In progress, Brand review, Scheduled, Overdue); checking one off shows Done. Late work sits at the top of today.
  • Projects: a KanbanBoard with Planning, Shooting, Editing and Publishing. Each card shows the brand, the title, the due date and a status badge.

The content area sits on background-layer-1 with 32px side padding and 24px between blocks; boards sit in panels on background-elevated. Keep extra lists (invoices, messages) on their own pages rather than adding blocks here.