Skip to content

Welcome to the documentation for MyPledge

Material is a design system created by Google to help teams build high-quality digital experiences for Android, iOS, Flutter, and the web. The biggest part of this product is built on Material 3 with some few components coming from Material design 2 and other design systems that will be noted over time in the documentation and refrenced.

Principles

  • Bold, graphic, intentional
    The design is guided by print design methods — typography, grids, space, scale, color, and imagery — to create hierarchy, meaning, and focus that immerse viewers in the experience.

  • Human
    The design is deeply committed to a high standard of accessibility, honesty, and respect for user attention.

  • Focused
    The design is aims to deliver what is needed, when its needed and why its needed without necessarily destracting the user.

  • Motion provides meaning
    Motion focuses attention and maintains continuity through subtle feedback and coherent transitions. As elements appear on screen, they transform and reorganize the environment with interactions generating new transformations.

Components

Material Components are interactive building blocks for creating a user interface, and include a built-in states system to communicate focus, selection, activation, error, hover, press, drag, and disabled states. Component libraries are available for Android, iOS, Flutter, and the web.

What does this documentation cover?

The documentation defines the qualities that can be expressed by UI regions, surfaces, and components. Design and strategize how your app is built using foundations that address design from both a broad and detailed perspective.

  • User flows
  • Design tokens
  • Color
  • Typography
  • Iconography
  • Dimensions
  • Layout grids
  • Border radius
  • Elevation
  • Motion
  • Content/product tone
  • Accessibility