Skip to content

Create custom CSS with different shades for basic ionic material colors like assertive, balanced, calm, energized, positive, royal

Notifications You must be signed in to change notification settings

gunjangarge/ionic-material-custom-colors

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Ionic Material Custom Colors

Introduction

A simple web application to create custom CSS with different shades for basic ionic material colors like assertive, balanced, calm, energized, positive, royal.

Currently supported components are buttons, header, checkbox and ranges.

Working : http://gunjangarge.github.io/ionic-material-custom-colors

##Sample Code Snippets ######(Code is taken directly from Ionic Documentation)

Checkbox

<ul class="list">
  <li class="item item-checkbox-calm-700">
     <label class="checkbox">
       <input type="checkbox">
     </label>
     Flux Capacitor
  </li>
</ul>

Button

<button class="button button-balanced-400">
  button-balanced-400
</button>

Header

<div class="bar bar-header bar-royal-400">
  <h1 class="title">bar-royal</h1>
</div>

Range

<div class="list">
  <div class="item range range-assertive-700">
    <i class="icon ion-ios-sunny-outline"></i>
    <input type="range" name="volume" min="0" max="100" value="33">
    <i class="icon ion-ios-sunny"></i>
  </div>
</div>

About

Create custom CSS with different shades for basic ionic material colors like assertive, balanced, calm, energized, positive, royal

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published