Development

This page contains information about the development of Minco

Mobile

This section is about the Minco mobile app development

UI Standards

This section explains the UI standards of the Minco mobile app

Colors

• Primary: #093d65
• Secondary: #60d394
• Warning: #e86558
• Secondary variant: #ffd97d
• Greay 1: #8a8a8a
• Greay 2: #595959
• Black variant: #262626
• White variant: #f6f6f6

Notes

• 50% opacity is used to depict disabled/inactive/unselected status (for eg: inactive tab color)

Text

Top Bar Heading

• Font Size: 20
• Font Weight: Bold
• Font Variant:
  • System Label - Uppercase
  • User Data - Exact Casing
• Color: Primary/White

Tab Heading

• Font Size: 18
• Font Weight:
  • Bold - when selected
  • Normal - When not selected
• Font Variant: Uppercase
• Color: Primary

List Heading

• Font Size: 18
• Font Weight: Bold
• Font Variant: Uppercase
• Color: Primary

Card Title

• Font Size: 18
• Font Weight: Bold
• Font Variant: Sentence case
• Color: Primary

Link/Clickable Label

• Font Size: 16
• Font Weight: Normal
• Font Variant: Sentence case
• Color: Primary

List Item Count Label

• Font Size: 16
• Font Weight: Normal
• Font Variant: Sentence case
• Color: Primary

Normal Text

• Font Size: 14
• Font Weight: Normal
• Font Variant: Sentence case
• Color: Primary

Notes

• 5% letter spacing is used in headings/titles

Icons

• Default size is 18
• If displayed beside the text,
  • Should have the same size as the text
  • Space between text and icon
    • Text size 20: 8
    • Text size below 20: 6

Buttons

Spacing