Typography

  • Style: Light Heading
  • Font: Roboto Light
  • Color: #31364c

Heading One 46px

Heading Two 36px

Heading Three 30px

Heading Four 28px

Heading Five 24px
Heading Six 18px
  • Style: Light Heading
  • Font: Roboto Light
  • Color: #31364c

HEADING ONE 46PX

HEADING TWO 36PX

HEADING THREE 30PX

HEADING FOUR 28PX

HEADING FIVE 24PX
HEADING SIX 18PX
  • Style: Black Heading
  • Font: Roboto Black
  • Color: #31364c

Heading One 46px

Heading Two 36px

Heading Three 30px

Heading Four 28px

Heading Five 24px
Heading Six 18px
  • Style: Black Heading
  • Font: Roboto Black
  • Color: #31364c

HEADING ONE 46PX

HEADING TWO 36PX

HEADING THREE 30PX

HEADING FOUR 28PX

HEADING FIVE 24PX
HEADING SIX 18PX
  • Font Size Text: 16px
  • Font: Roboto Regular
  • Line Spacing: 24px
  • Color: #9699a6

Heading One 46px

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.

  • Font Size Text: 14px
  • Font: Roboto Regular
  • Line Spacing: 24px
  • Color: #9699a6

Heading Three 30px

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh eui-
smod tincidunt ut laoreet dolore magna aliquam.

  • Font Size Quote: 30px
  • Font: Roboto Light Italic
  • Line Spacing: 36px
  • Color: #93c25e
  • Font Size Author: 14px
  • Font: Roboto Regular
  • Line Spacing: 24px
  • Color: #cdcfd7

Claritas est etiam processus dynamicus, qui sequitur mu-
tationem consuet.

Frank Aams
  • Font Size Quote: 30px
  • Font: Roboto Light Italic
  • Line Spacing: 36px
  • Color: #ffffff
  • Background: #93c25e
  • Font Size Author: 14px
  • Font: Roboto Regular
  • Line Spacing: 24px
  • Color: #ffffff

Claritas est etiam processus dy-
namicus, qui sequitur mutationem consuet.

  • Font Size Text: 14px
  • Font: Roboto Regular
  • Line Spacing: 20px
  • Color Text: #9699a6
  • Icon Color: #ccdb38
  • Claritas est etia processus;
  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit;
  • Eodem modo typi, qui nunc nobis;
  • Nam liber tempor cum soluta nobis eleifend optio;
  • Duis autem vel eum iriure dolor.
  • Font Size Text: 14px
  • Font: Roboto Regular
  • Line Spacing: 20px
  • Color Text: #cdcfd7
  • Icon Color: #f04e4e
  • Claritas est etia processus;
  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit;
  • Eodem modo typi, qui nunc nobis;
  • Nam liber tempor cum soluta nobis eleifend optio;
  • Duis autem vel eum iriure dolor.

Colors of Sections

  • Section: Doctors Timetable
  • Basic Color: #6739b6
  • Accompanying Color: #582aa6
  • Section: Emergency Cases
  • Basic Color: #9c26b0
  • Accompanying Color: #8c1b9f
  • Section: Appointments
  • Basic Color: #e91d62
  • Accompanying Color: #d50c50
  • Section: Working Time
  • Basic Color: #ff9700
  • Accompanying Color: #ec8e06
  • Section: Primary Health Care
  • Basic Color: #f04e4e
  • Accompanying Color: #e44546
  • Section: Pediatric Clinic
  • Basic Color: #fecc17
  • Accompanying Color: #f8c407
  • Section: Outpatient Surgery
  • Basic Color: #ccdb38
  • Accompanying Color: #fc3d22f
  • Section: Gynaecological Clinic
  • Basic Color: #00bff3
  • Accompanying Color: #00afdf
  • Section: Cardiac Clinic
  • Basic Color: #6739b6
  • Accompanying Color: #582aa6
  • Section: Laryngological Clinic
  • Basic Color: #9c26b0
  • Accompanying Color: #8c1b9f
  • Section: Opthalmology Clinic
  • Basic Color: #e91d62
  • Accompanying Color: #d50c50
  • Section: Dental Clinic
  • Basic Color: #ff9700
  • Accompanying Color: #ec8e06

Style of Buttons

  • Style: Mini Button
  • Font: Roboto Regular
  • Font-Size: 13px
  • Font & Icon Color: #ffffff
  • Button Color: #252525
  • Radius Button: 16px
  • Style: Small Button
  • Font: Roboto Regular
  • Font-Size: 14px
  • Font & Icon Color: #ffffff
  • Button Color: #252525
  • Radius Button: 20px
  • Style: Medium Button
  • Font: Roboto Regular
  • Font-Size: 16px
  • Font & Icon Color: #ffffff
  • Button Color: #252525
  • Radius Button: 27px
  • Style: Large Button
  • Font: Roboto Regular
  • Font-Size: 18px
  • Font & Icon Color: #ffffff
  • Button Color: #252525
  • Radius Button: 32px
  • Style: Extra Large Button
  • Font: Roboto Light
  • Font-Size: 24px
  • Font & Icon Color: #ffffff
  • Button Color: #252525
  • Radius Button: 37px
  • Style: Mini Button
  • Button Color: #f04e4e
  • Style: Small Button
  • Button Color: #f04e4e
  • Style: Medium Button
  • Button Color: #f04e4e
  • Style: Large Button
  • Button Color: #f04e4e
  • Style: Extra Large Button
  • Button Color: #f04e4e
  • Style: Mini Button
  • Button Color: #fecc17
  • Style: Small Button
  • Button Color: #fecc17
  • Style: Medium Button
  • Button Color: #fecc17
  • Style: Large Button
  • Button Color: #fecc17
  • Style: Extra Large Button
  • Button Color: #fecc17
  • Style: Mini Button
  • Button Color: #ccdb38
  • Style: Small Button
  • Button Color: #ccdb38
  • Style: Medium Button
  • Button Color: #ccdb38
  • Style: Large Button
  • Button Color: #ccdb38
  • Style: Extra Large Button
  • Button Color: #ccdb38
  • Style: Mini Button
  • Button Color: #00bff3
  • Style: Small Button
  • Button Color: #00bff3
  • Style: Medium Button
  • Button Color: #00bff3
  • Style: Large Button
  • Button Color: #00bff3
  • Style: Extra Large Button
  • Button Color: #00bff3
  • Style: Mini Button
  • Button Color: #ff9700
  • Style: Small Button
  • Button Color: #ff9700
  • Style: Medium Button
  • Button Color: #ff9700
  • Style: Large Button
  • Button Color: #ff9700
  • Style: Extra Large Button
  • Button Color: #ff9700
  • Style: Round Button
  • Icon Color: #ffffff
  • Button Color: #252525
  • Button Size: 40px×40px
  • Style: Round Button
  • Icon Color: #ffffff
  • Button Color: #f04e4e
  • Button Size: 40px×40px
  • Style: Round Button
  • Icon Color: #ffffff
  • Button Color: #f04e4e
  • Button Size: 70px×70px
  • Style: Square Button
  • Icon Color: #ffffff
  • Button Size: 40px×40px
  • View Photo Button Color: #f04e4e
  • Like Button Color: #dd4344
  • Post Detail Button Color: #cb4243
  • Style: Square Button
  • Icon Color: #ffffff
  • Button Size: 40px×40px
  • Tooltip Bg Color: #313539
  • Font Color: #ffffff
  • Font Size: 12px

Form's Elements

  • Font: Roboto Regular
  • Font Size: 16px
  • Normal Text Color: #cdcfd7
  • Active Text Color: #9699a6
  • Normal Form Line Color: #cdcfd7
  • Active Form Line Color: #f04e4e
  • Font: Roboto Regular
  • Font Size: 16px
  • Normal Text Color: #6b6d76
  • Active Text Color: #ffffff
  • Normal Form Line Color: #414549
  • Active Form Line Color: #f04e4e
  • Font: Roboto Regular
  • Font Size: 16px
  • Normal Text Color: #cdcfd7
  • Active Text Color: #9699a6
  • Dropdown List Normal Color: #cdcfd7
  • Dropdown List Active Color: #00bff3
  • Selected Point Text Color: #ffffff
  • Selected Point Bg Color: #f04e4e
  • Font Color Plans: #9699a6
  • Font Size Plans: 14px
  • Hover Font Color Plans: #f04e4e
  • Bg Hover Color: #fafafa
  • Font: Roboto Regular
  • Font Size: 16px
  • Normal Text Color: #cdcfd7
  • Active Text Color: #9699a6
  • Dropdown List Normal Color: #cdcfd7
  • Dropdown List Active Color: #00bff3
  • Selected Point Text Color: #ffffff
  • Selected Point Bg Color: #00bff3
  • Font Color Plans: #9699a6
  • Font Size Plans: 14px
  • Hover Font Color Plans: #00bff3
  • Bg Hover Color: #fafafa