---
title: "Cadence — Day Schedule"
platform: android
slug: cadence-day-schedule
screens: ["calendar"]
domains: ["productivity"]
style: "material"
fonts: ["Roboto"]
roles: ["top-navigation-bar", "button", "avatar", "segmented-control", "date-picker", "floating-action-button", "tab-bar"]
score: {clean: 94, consistent: 95, accessible: 80, comprehensible: 48}
url: https://gui.farm/android/cadence-day-schedule
raw: https://gui.farm/android/cadence-day-schedule/design.guix
download: https://gui.farm/android/cadence-day-schedule.gui
---

# Cadence — Day Schedule

A dark-theme Android day agenda led by an "Up next" card, with an all-day chip and hourly colour-coded events on a time grid.

- **Live preview:** https://gui.farm/android/cadence-day-schedule
- **Raw source:** https://gui.farm/android/cadence-day-schedule/design.guix
- **Download (.gui):** https://gui.farm/android/cadence-day-schedule.gui

## Source (design.guix)

```xml
<gui version="0.2" name="Cadence — Day Schedule">
  <tokens>
    <color name="surface" value="#121317" />
    <color name="surface-container" value="#1E2024" />
    <color name="surface-container-high" value="#282A2E" />
    <color name="on-surface" value="#E3E2E6" />
    <color name="on-surface-variant" value="#C4C6CF" />
    <color name="outline" value="#8E9099" />
    <color name="outline-variant" value="#3A3C40" />
    <color name="primary" value="#A9C7FF" />
    <color name="on-primary" value="#003064" />
    <color name="primary-container" value="#234776" />
    <color name="on-primary-container" value="#D5E3FF" />
    <color name="now" value="#FF8A80" />
    <color name="ev-blue" value="#1E3A5F" />
    <color name="on-ev-blue" value="#D3E3FF" />
    <color name="ev-purple" value="#362A54" />
    <color name="on-ev-purple" value="#E7DEFF" />
    <color name="ev-green" value="#21402C" />
    <color name="on-ev-green" value="#B9F0C1" />
    <color name="ev-teal" value="#103F3E" />
    <color name="on-ev-teal" value="#A2F0E9" />
    <color name="ev-amber" value="#4A3A16" />
    <color name="on-ev-amber" value="#FFDEAB" />
    <color name="ev-rose" value="#5A2B33" />
    <color name="on-ev-rose" value="#FFD9DE" />
    <number name="r-xs" value="4" />
    <number name="r-sm" value="8" />
    <number name="r-lg" value="16" />
    <number name="r-full" value="999" />
  </tokens>

  <styles>
    <text-style name="TitleLarge" font-family="Roboto" font-size="22" font-weight="400" line-height="28" />
    <text-style name="TitleSmall" font-family="Roboto" font-size="14" font-weight="500" line-height="20" />
    <text-style name="LabelLarge" font-family="Roboto" font-size="14" font-weight="500" line-height="20" />
    <text-style name="LabelMedium" font-family="Roboto" font-size="12" font-weight="500" line-height="16" />
    <text-style name="LabelSmall" font-family="Roboto" font-size="11" font-weight="500" line-height="16" />
  </styles>

  <fonts>
    <font family="Roboto" source="google" weights="400 500 700" styles="normal" />
  </fonts>

  <col w="360" fill="$surface">

    <!-- status bar : device chrome, untagged -->
    <row w="fill" h="28" p="0 16" gap="auto" align="middle-left">
      <text text-style="LabelSmall" value="9:41" fill="$on-surface" />
      <row gap="6" align="middle-right">
        <img src="https://api.iconify.design/material-symbols/signal-cellular-alt-rounded.svg?color=%23E3E2E6" w="15" h="15" />
        <img src="https://api.iconify.design/material-symbols/wifi-rounded.svg?color=%23E3E2E6" w="15" h="15" />
        <img src="https://api.iconify.design/material-symbols/battery-full-alt-rounded.svg?color=%23E3E2E6" w="15" h="15" />
      </row>
    </row>

    <!-- top app bar -->
    <row role="top-navigation-bar" w="fill" h="64" p="0 12 0 16" gap="12" align="middle-left">
      <img src="https://api.iconify.design/material-symbols/menu-rounded.svg?color=%23E3E2E6" w="24" h="24" />
      <col w="fill" gap="0">
        <text text-style="TitleLarge" value="August" fill="$on-surface" />
        <text text-style="LabelMedium" value="Tuesday, 11" fill="$on-surface-variant" />
      </col>
      <row role="button" w="40" h="40" radius="$r-full" align="middle-center">
        <img src="https://api.iconify.design/material-symbols/search-rounded.svg?color=%23C4C6CF" w="24" h="24" />
      </row>
      <row role="avatar" w="36" h="36" radius="$r-full" fill="$primary-container" align="middle-center">
        <text text-style="LabelLarge" value="JJ" fill="$on-primary-container" />
      </row>
    </row>

    <!-- Day / Week / Month segmented control -->
    <row w="fill" p="4 16 0 16" align="middle-center">
    <row role="segmented-control" w="fill" h="40" radius="$r-full" border="1 $outline-variant" clip="true" align="middle-center">
      <row w="fill" h="fill" fill="$primary-container" gap="6" align="middle-center">
        <img src="https://api.iconify.design/material-symbols/check-rounded.svg?color=%23D5E3FF" w="18" h="18" />
        <text text-style="LabelLarge" value="Day" fill="$on-primary-container" />
      </row>
      <line direction="vertical" fill="$outline-variant" />
      <row w="fill" h="fill" align="middle-center">
        <text text-style="LabelLarge" value="Week" fill="$on-surface-variant" />
      </row>
      <line direction="vertical" fill="$outline-variant" />
      <row w="fill" h="fill" align="middle-center">
        <text text-style="LabelLarge" value="Month" fill="$on-surface-variant" />
      </row>
    </row>
    </row>

    <!-- week date strip -->
    <row role="date-picker" w="fill" p="12 16" gap="0" align="middle-center">
      <col w="fill" gap="6" align="middle-center">
        <text text-style="LabelMedium" value="M" fill="$on-surface-variant" />
        <row w="36" h="36" radius="$r-full" align="middle-center">
          <text text-style="LabelLarge" value="10" fill="$on-surface" />
        </row>
      </col>
      <col w="fill" gap="6" align="middle-center">
        <text text-style="LabelMedium" value="T" fill="$primary" />
        <row w="36" h="36" radius="$r-full" fill="$primary" align="middle-center">
          <text text-style="LabelLarge" value="11" fill="$on-primary" />
        </row>
      </col>
      <col w="fill" gap="6" align="middle-center">
        <text text-style="LabelMedium" value="W" fill="$on-surface-variant" />
        <row w="36" h="36" radius="$r-full" align="middle-center">
          <text text-style="LabelLarge" value="12" fill="$on-surface" />
        </row>
      </col>
      <col w="fill" gap="6" align="middle-center">
        <text text-style="LabelMedium" value="T" fill="$on-surface-variant" />
        <row w="36" h="36" radius="$r-full" align="middle-center">
          <text text-style="LabelLarge" value="13" fill="$on-surface" />
        </row>
      </col>
      <col w="fill" gap="6" align="middle-center">
        <text text-style="LabelMedium" value="F" fill="$on-surface-variant" />
        <row w="36" h="36" radius="$r-full" align="middle-center">
          <text text-style="LabelLarge" value="14" fill="$on-surface" />
        </row>
      </col>
      <col w="fill" gap="6" align="middle-center">
        <text text-style="LabelMedium" value="S" fill="$on-surface-variant" />
        <row w="36" h="36" radius="$r-full" align="middle-center">
          <text text-style="LabelLarge" value="15" fill="$on-surface" />
        </row>
      </col>
      <col w="fill" gap="6" align="middle-center">
        <text text-style="LabelMedium" value="S" fill="$on-surface-variant" />
        <row w="36" h="36" radius="$r-full" align="middle-center">
          <text text-style="LabelLarge" value="16" fill="$on-surface" />
        </row>
      </col>
    </row>

    <!-- all-day event -->
    <row w="fill" p="0 16 8 16" gap="10" align="middle-left">
      <text w="40" align="right" text-style="LabelSmall" value="All-day" fill="$on-surface-variant" />
      <row w="fill" h="30" radius="$r-xs" fill="$surface-container-high" p="0 12" align="middle-left">
        <text text-style="LabelLarge" value="Team offsite: Q3 planning" fill="$on-surface" />
      </row>
    </row>

    <!-- ================= TIME GRID ================= -->
    <frame w="360" h="648" fill="$surface">

      <!-- hour rules -->
      <rect x="52" y="0"   w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="64"  w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="128" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="192" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="256" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="320" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="384" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="448" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="512" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="576" w="292" h="1" fill="$outline-variant" />
      <rect x="52" y="640" w="292" h="1" fill="$outline-variant" />

      <!-- hour labels (gutter) -->
      <text x="8" y="4"   w="40" align="right" text-style="LabelSmall" value="8 AM"  fill="$on-surface-variant" />
      <text x="8" y="68"  w="40" align="right" text-style="LabelSmall" value="9 AM"  fill="$on-surface-variant" />
      <text x="8" y="132" w="40" align="right" text-style="LabelSmall" value="10 AM" fill="$on-surface-variant" />
      <text x="8" y="196" w="40" align="right" text-style="LabelSmall" value="11 AM" fill="$on-surface-variant" />
      <text x="8" y="260" w="40" align="right" text-style="LabelSmall" value="12 PM" fill="$on-surface-variant" />
      <text x="8" y="324" w="40" align="right" text-style="LabelSmall" value="1 PM"  fill="$on-surface-variant" />
      <text x="8" y="388" w="40" align="right" text-style="LabelSmall" value="2 PM"  fill="$on-surface-variant" />
      <text x="8" y="452" w="40" align="right" text-style="LabelSmall" value="3 PM"  fill="$on-surface-variant" />
      <text x="8" y="516" w="40" align="right" text-style="LabelSmall" value="4 PM"  fill="$on-surface-variant" />
      <text x="8" y="580" w="40" align="right" text-style="LabelSmall" value="5 PM"  fill="$on-surface-variant" />
      <text x="8" y="644" w="40" align="right" text-style="LabelSmall" value="6 PM"  fill="$on-surface-variant" />

      <!-- 08:00-09:00 Deep work -->
      <frame x="60" y="0" w="284" h="64" radius="$r-sm" fill="$ev-blue" clip="true">
        <rect x="0" y="0" w="4" h="64" fill="$on-ev-blue" />
        <col x="14" y="8" w="256" gap="2">
          <text max-lines="1" truncate="true" text-style="TitleSmall" value="Deep work: Q3 roadmap" fill="$on-ev-blue" />
          <text text-style="LabelSmall" value="8:00 – 9:00 AM" fill="$on-ev-blue" />
        </col>
      </frame>

      <!-- 09:30-11:00 Design critique -->
      <frame x="60" y="96" w="284" h="96" radius="$r-sm" fill="$ev-purple" clip="true">
        <rect x="0" y="0" w="4" h="96" fill="$on-ev-purple" />
        <col x="14" y="10" w="256" gap="3">
          <text max-lines="1" truncate="true" text-style="TitleSmall" value="Design critique" fill="$on-ev-purple" />
          <text text-style="LabelSmall" value="9:30 – 11:00 AM" fill="$on-ev-purple" />
          <text text-style="LabelSmall" value="Studio B · 4 people" fill="$on-ev-purple" />
        </col>
      </frame>

      <!-- 11:00-12:00 Team standup (left half) -->
      <frame x="60" y="192" w="139" h="64" radius="$r-sm" fill="$ev-green" clip="true">
        <rect x="0" y="0" w="4" h="64" fill="$on-ev-green" />
        <col x="14" y="8" w="111" gap="2">
          <text max-lines="1" truncate="true" text-style="TitleSmall" value="Team standup" fill="$on-ev-green" />
          <text text-style="LabelSmall" value="11:00 AM" fill="$on-ev-green" />
        </col>
      </frame>

      <!-- 11:00-12:00 Candidate interview (right half) -->
      <frame x="205" y="192" w="139" h="64" radius="$r-sm" fill="$ev-teal" clip="true">
        <rect x="0" y="0" w="4" h="64" fill="$on-ev-teal" />
        <col x="14" y="8" w="111" gap="2">
          <text max-lines="1" truncate="true" text-style="TitleSmall" value="Interview · Priya" fill="$on-ev-teal" />
          <text text-style="LabelSmall" value="11:00 AM" fill="$on-ev-teal" />
        </col>
      </frame>

      <!-- 12:30-13:30 Lunch -->
      <frame x="60" y="288" w="284" h="64" radius="$r-sm" fill="$ev-amber" clip="true">
        <rect x="0" y="0" w="4" h="64" fill="$on-ev-amber" />
        <col x="14" y="8" w="256" gap="2">
          <text max-lines="1" truncate="true" text-style="TitleSmall" value="Lunch &amp; walk" fill="$on-ev-amber" />
          <text text-style="LabelSmall" value="12:30 – 1:30 PM" fill="$on-ev-amber" />
        </col>
      </frame>

      <!-- 14:00-15:30 Product review -->
      <frame x="60" y="384" w="284" h="96" radius="$r-sm" fill="$ev-rose" clip="true">
        <rect x="0" y="0" w="4" h="96" fill="$on-ev-rose" />
        <col x="14" y="10" w="256" gap="3">
          <text max-lines="1" truncate="true" text-style="TitleSmall" value="Product review" fill="$on-ev-rose" />
          <text text-style="LabelSmall" value="2:00 – 3:30 PM" fill="$on-ev-rose" />
          <text text-style="LabelSmall" value="Roadmap sign-off" fill="$on-ev-rose" />
        </col>
      </frame>

      <!-- now indicator : 1:15 PM -->
      <ellipse x="46" y="331" w="10" h="10" fill="$now" />
      <rect x="52" y="335" w="292" h="2" fill="$now" />

      <!-- FAB : new event -->
      <frame role="floating-action-button" x="288" y="568" w="56" h="56" radius="$r-lg" fill="$primary-container">
        <img x="16" y="16" src="https://api.iconify.design/material-symbols/add-rounded.svg?color=%23D5E3FF" w="24" h="24" />
      </frame>

    </frame>

    <!-- bottom navigation -->
    <row role="tab-bar" w="fill" h="80" fill="$surface-container" p="12 0 0 0" gap="auto" align="top-center">
      <col w="90" gap="4" align="middle-center">
        <row w="64" h="32" radius="$r-full" fill="$primary-container" align="middle-center">
          <img src="https://api.iconify.design/material-symbols/calendar-view-day-rounded.svg?color=%23D5E3FF" w="24" h="24" />
        </row>
        <text text-style="LabelMedium" value="Schedule" fill="$on-surface" />
      </col>
      <col w="90" gap="4" align="middle-center">
        <row w="64" h="32" align="middle-center">
          <img src="https://api.iconify.design/material-symbols/calendar-month-outline-rounded.svg?color=%23C4C6CF" w="24" h="24" />
        </row>
        <text text-style="LabelMedium" value="Month" fill="$on-surface-variant" />
      </col>
      <col w="90" gap="4" align="middle-center">
        <row w="64" h="32" align="middle-center">
          <img src="https://api.iconify.design/material-symbols/task-alt-rounded.svg?color=%23C4C6CF" w="24" h="24" />
        </row>
        <text text-style="LabelMedium" value="Tasks" fill="$on-surface-variant" />
      </col>
      <col w="90" gap="4" align="middle-center">
        <row w="64" h="32" align="middle-center">
          <img src="https://api.iconify.design/material-symbols/person-outline-rounded.svg?color=%23C4C6CF" w="24" h="24" />
        </row>
        <text text-style="LabelMedium" value="Profile" fill="$on-surface-variant" />
      </col>
    </row>

  </col>
</gui>

```