Theming

You can create your favourite colors by using Ionic Color Generator.

Please check "ionicframework.com/docs/theming/color-generator"

Copy your variables to "src/theme/variables.scss"

// Ionic Variables and Theming. For more info, please see:
// http://ionicframework.com/docs/theming/

/** Ionic CSS Variables **/
:root {
/** primary **/
--ion-color-primary: #535EEB;
--ion-color-primary-rgb: 83,94,235;
--ion-color-primary-contrast: #ffffff;
--ion-color-primary-contrast-rgb: 255,255,255;
--ion-color-primary-shade: #4953cf;
--ion-color-primary-tint: #646eed;

/** secondary **/
--ion-color-secondary: #5CE5D5;
--ion-color-secondary-rgb: 92,229,213;
--ion-color-secondary-contrast: #ffffff;
--ion-color-secondary-contrast-rgb: 0,0,0;
--ion-color-secondary-shade: #51cabb;
--ion-color-secondary-tint: #6ce8d9;

/** tertiary **/
--ion-color-tertiary: #BC75F9;
--ion-color-tertiary-rgb: 188,117,249;
--ion-color-tertiary-contrast: #000000;
--ion-color-tertiary-contrast-rgb: 0,0,0;
--ion-color-tertiary-shade: #a567db;
--ion-color-tertiary-tint: #c383fa;

/** success **/
--ion-color-success: #BC75F9;
--ion-color-success-rgb: 16, 220, 96;
--ion-color-success-contrast: #ffffff;
--ion-color-success-contrast-rgb: 255, 255, 255;
--ion-color-success-shade: #a567db;
--ion-color-success-tint: #c383fa;

/** warning **/
--ion-color-warning: #FFAA01;
--ion-color-warning-rgb: 255,170,1;
--ion-color-warning-contrast: #000000;
--ion-color-warning-contrast-rgb: 0,0,0;
--ion-color-warning-shade: #e09601;
--ion-color-warning-tint: #ffb31a;

/** danger **/
--ion-color-danger: #FF2079;
--ion-color-danger-rgb: 255,32,121;
--ion-color-danger-contrast: #ffffff;
--ion-color-danger-contrast-rgb: 255,255,255;
--ion-color-danger-shade: #e01c6a;
--ion-color-danger-tint: #ff3686;

/** dark **/
--ion-color-dark: #001437;
--ion-color-dark-rgb: 0,20,55;
--ion-color-dark-contrast: #ffffff;
--ion-color-dark-contrast-rgb: 255,255,255;
--ion-color-dark-shade: #001230;
--ion-color-dark-tint: #1a2c4b;

/** medium **/
--ion-color-medium: #BDBDFD;
--ion-color-medium-rgb: 189,189,253;
--ion-color-medium-contrast: #000000;
--ion-color-medium-contrast-rgb: 0,0,0;
--ion-color-medium-shade: #a6a6df;
--ion-color-medium-tint: #c4c4fd;

/** light **/
--ion-color-light: #ffffff;
--ion-color-light-rgb: 244,244,244;
--ion-color-light-contrast: #ffffff;
--ion-color-light-contrast-rgb: 0,0,0;
--ion-color-light-shade: #d7d8da;
--ion-color-light-tint: #f5f6f9;

}