Keiki Learning games for Kids

Colors

• #4b36c4primary-purple · screen background
• #edeafcbubble-white · speech bubble fill · back arrow fill
• #271c66text-dark-purple · speech bubble text
• #42d93eaccent-green · progress fill
• #5742cfcard-purple · tile background
• #fffffftext-white · tile title text
• #43329ccheckmark-unselected · unselected checkmark indicator
• #9f93eeinstruction-purple · subheading instruction text
• #5745b7button-disabled-purple · disabled continue button

Type

• bubble-dialogueNunito · 34px · 800 · #271c66
• instruction-subtitleNunito · 28px · 700 · #9f93ee
• grid-tile-labelNunito · 30px · 800 · #ffffff
• cta-buttonNunito · 36px · 800 · #8c82cb

Elements

• 2x3 Grid of Feature Tiles · grid

  2 columns by 3 rows, each tile approx 460px wide by 320px high, 36px horizontal and 28px vertical spacing · Rounded square purple card tiles with top-right faint checkmark icon, centered thematic illustration, and bottom centered multi-line text label

• Disabled Continue Button · button

  Bottom pinned container (~960px wide, ~132px high) · Muted lavender-purple button with low-contrast inactive text

Layout

Grid-based multi-selection layout featuring an instruction subhead, a 2x3 matrix of card tiles, and a persistent disabled CTA button pinned to the bottom.

Notes

Checkmarks located in the upper-right corner of each tile indicate toggle state.