Ionic Material Custom Colors

Fork me on GitHub

Steps:

  1. Check colors you want to include in custom CSS file
  2. Click on download button. This will generate a CSS with custom colors
  3. Include this CSS in your index.html or include it in your SCSS file after "Include all of Ionic"
  4. Ensure that you have ionic material CSS in index.html
  5. Use these custom colors as assertive-700, calm-400 etc.
Download CSS Clear Selection

Selected

{{tile.color}}
{{tile.shadeNumber}}

Assertive

{{tile.color}}
{{tile.shadeNumber}}

Royal

{{tile.color}}
{{tile.shadeNumber}}

Balanced

{{tile.color}}
{{tile.shadeNumber}}

Positive

{{tile.color}}
{{tile.shadeNumber}}

Energized

{{tile.color}}
{{tile.shadeNumber}}

Calm

{{tile.color}}
{{tile.shadeNumber}}