JANGO Provides super flexible color helper classes to customize element colors on fly without editing any css. Click below color options to view usage demos.
class="c-font-white"
class="c-border-white"
class="c-bg-white c-bg-white-font"
class="c-btn-white"
class="c-btn-border-1x c-btn-white"
class="c-btn-border-2x c-btn-white"
class="c-font-black"
class="c-border-black"
class="c-bg-black c-bg-black-font"
class="c-btn-black"
class="c-btn-border-1x c-btn-black"
class="c-btn-border-2x c-btn-black"
class="c-font-regular"
class="c-border-regular"
class="c-bg-regular c-bg-regular-font"
class="c-btn-regular"
class="c-btn-border-1x c-btn-regular"
class="c-btn-border-2x c-btn-regular"
class="c-font-grey"
class="c-border-grey"
class="c-bg-grey c-bg-grey-font"
class="c-btn-grey"
class="c-btn-border-1x c-btn-grey"
class="c-btn-border-2x c-btn-grey"
class="c-font-grey-1"
class="c-border-grey-1"
class="c-bg-grey-1 c-bg-grey-1-font"
class="c-btn-grey-1"
class="c-btn-border-1x c-btn-grey-1"
class="c-btn-border-2x c-btn-grey-1"
class="c-font-grey-2"
class="c-border-grey-2"
class="c-bg-grey-2 c-bg-grey-2-font"
class="c-btn-grey-2"
class="c-btn-border-1x c-btn-grey-2"
class="c-btn-border-2x c-btn-grey-2"
class="c-font-grey-3"
class="c-border-grey-3"
class="c-bg-grey-3 c-bg-grey-3-font"
class="c-btn-grey-3"
class="c-btn-border-1x c-btn-grey-3"
class="c-btn-border-2x c-btn-grey-3"
class="c-font-grey-4"
class="c-border-grey-4"
class="c-bg-grey-4 c-bg-grey-4-font"
class="c-btn-grey-4"
class="c-btn-border-1x c-btn-grey-4"
class="c-btn-border-2x c-btn-grey-4"
class="c-font-green"
class="c-border-green"
class="c-bg-green c-bg-green-font"
class="c-btn-green"
class="c-btn-border-1x c-btn-green"
class="c-btn-border-2x c-btn-green"
class="c-font-green-1"
class="c-border-green-1"
class="c-bg-green-1 c-bg-green-1-font"
class="c-btn-green-1"
class="c-btn-border-1x c-btn-green-1"
class="c-btn-border-2x c-btn-green-1"
class="c-font-green-2"
class="c-border-green-2"
class="c-bg-green-2 c-bg-green-2-font"
class="c-btn-green-2"
class="c-btn-border-1x c-btn-green-2"
class="c-btn-border-2x c-btn-green-2"
class="c-font-green-3"
class="c-border-green-3"
class="c-bg-green-3 c-bg-green-3-font"
class="c-btn-green-3"
class="c-btn-border-1x c-btn-green-3"
class="c-btn-border-2x c-btn-green-3"
class="c-font-green-4"
class="c-border-green-4"
class="c-bg-green-4 c-bg-green-4-font"
class="c-btn-green-4"
class="c-btn-border-1x c-btn-green-4"
class="c-btn-border-2x c-btn-green-4"
class="c-font-red"
class="c-border-red"
class="c-bg-red c-bg-red-font"
class="c-btn-red"
class="c-btn-border-1x c-btn-red"
class="c-btn-border-2x c-btn-red"
class="c-font-red-1"
class="c-border-red-1"
class="c-bg-red-1 c-bg-red-1-font"
class="c-btn-red-1"
class="c-btn-border-1x c-btn-red-1"
class="c-btn-border-2x c-btn-red-1"
class="c-font-red-2"
class="c-border-red-2"
class="c-bg-red-2 c-bg-red-2-font"
class="c-btn-red-2"
class="c-btn-border-1x c-btn-red-2"
class="c-btn-border-2x c-btn-red-2"
class="c-font-red-3"
class="c-border-red-3"
class="c-bg-red-3 c-bg-red-3-font"
class="c-btn-red-3"
class="c-btn-border-1x c-btn-red-3"
class="c-btn-border-2x c-btn-red-3"
class="c-font-yellow"
class="c-border-yellow"
class="c-bg-yellow c-bg-yellow-font"
class="c-btn-yellow"
class="c-btn-border-1x c-btn-yellow"
class="c-btn-border-2x c-btn-yellow"
class="c-font-yellow-1"
class="c-border-yellow-1"
class="c-bg-yellow-1 c-bg-yellow-1-font"
class="c-btn-yellow-1"
class="c-btn-border-1x c-btn-yellow-1"
class="c-btn-border-2x c-btn-yellow-1"
class="c-font-yellow-2"
class="c-border-yellow-2"
class="c-bg-yellow-2 c-bg-yellow-2-font"
class="c-btn-yellow-2"
class="c-btn-border-1x c-btn-yellow-2"
class="c-btn-border-2x c-btn-yellow-2"
class="c-font-yellow-3"
class="c-border-yellow-3"
class="c-bg-yellow-3 c-bg-yellow-3-font"
class="c-btn-yellow-3"
class="c-btn-border-1x c-btn-yellow-3"
class="c-btn-border-2x c-btn-yellow-3"
class="c-font-yellow-4"
class="c-border-yellow-4"
class="c-bg-yellow-4 c-bg-yellow-4-font"
class="c-btn-yellow-4"
class="c-btn-border-1x c-btn-yellow-4"
class="c-btn-border-2x c-btn-yellow-4"
class="c-font-blue"
class="c-border-blue"
class="c-bg-blue c-bg-blue-font"
class="c-btn-blue"
class="c-btn-border-1x c-btn-blue"
class="c-btn-border-2x c-btn-blue"
class="c-font-blue-1"
class="c-border-blue-1"
class="c-bg-blue-1 c-bg-blue-1-font"
class="c-btn-blue-1"
class="c-btn-border-1x c-btn-blue-1"
class="c-btn-border-2x c-btn-blue-1"
class="c-font-blue-2"
class="c-border-blue-2"
class="c-bg-blue-2 c-bg-blue-2-font"
class="c-btn-blue-2"
class="c-btn-border-1x c-btn-blue-2"
class="c-btn-border-2x c-btn-blue-2"
class="c-font-blue-3"
class="c-border-blue-3"
class="c-bg-blue-3 c-bg-blue-3-font"
class="c-btn-blue-3"
class="c-btn-border-1x c-btn-blue-3"
class="c-btn-border-2x c-btn-blue-3"
class="c-font-blue-4"
class="c-border-blue-4"
class="c-bg-blue-4 c-bg-blue-4-font"
class="c-btn-blue-4"
class="c-btn-border-1x c-btn-blue-4"
class="c-btn-border-2x c-btn-blue-4"
class="c-font-purple"
class="c-border-purple"
class="c-bg-purple c-bg-purple-font"
class="c-btn-purple"
class="c-btn-border-1x c-btn-purple"
class="c-btn-border-2x c-btn-purple"
class="c-font-purple-1"
class="c-border-purple-1"
class="c-bg-purple-1 c-bg-purple-1-font"
class="c-btn-purple-1"
class="c-btn-border-1x c-btn-purple-1"
class="c-btn-border-2x c-btn-purple-1"
class="c-font-purple-2"
class="c-border-purple-2"
class="c-bg-purple-2 c-bg-purple-2-font"
class="c-btn-purple-2"
class="c-btn-border-1x c-btn-purple-2"
class="c-btn-border-2x c-btn-purple-2"
class="c-font-purple-3"
class="c-border-purple-3"
class="c-bg-purple-3 c-bg-purple-3-font"
class="c-btn-purple-3"
class="c-btn-border-1x c-btn-purple-3"
class="c-btn-border-2x c-btn-purple-3"
class="c-font-brown"
class="c-border-brown"
class="c-bg-brown c-bg-brown-font"
class="c-btn-brown"
class="c-btn-border-1x c-btn-brown"
class="c-btn-border-2x c-btn-brown"
class="c-font-brown-1"
class="c-border-brown-1"
class="c-bg-brown-1 c-bg-brown-1-font"
class="c-btn-brown-1"
class="c-btn-border-1x c-btn-brown-1"
class="c-btn-border-2x c-btn-brown-1"
class="c-font-brown-2"
class="c-border-brown-2"
class="c-bg-brown-2 c-bg-brown-2-font"
class="c-btn-brown-2"
class="c-btn-border-1x c-btn-brown-2"
class="c-btn-border-2x c-btn-brown-2"
class="c-font-brown-3"
class="c-border-brown-3"
class="c-bg-brown-3 c-bg-brown-3-font"
class="c-btn-brown-3"
class="c-btn-border-1x c-btn-brown-3"
class="c-btn-border-2x c-btn-brown-3"
class="c-font-dark"
class="c-border-dark"
class="c-bg-dark c-bg-dark-font"
class="c-btn-dark"
class="c-btn-border-1x c-btn-dark"
class="c-btn-border-2x c-btn-dark"
class="c-font-dark-1"
class="c-border-dark-1"
class="c-bg-dark-1 c-bg-dark-1-font"
class="c-btn-dark-1"
class="c-btn-border-1x c-btn-dark-1"
class="c-btn-border-2x c-btn-dark-1"
class="c-font-dark-2"
class="c-border-dark-2"
class="c-bg-dark-2 c-bg-dark-2-font"
class="c-btn-dark-2"
class="c-btn-border-1x c-btn-dark-2"
class="c-btn-border-2x c-btn-dark-2"
class="c-font-dark-3"
class="c-border-dark-3"
class="c-bg-dark-3 c-bg-dark-3-font"
class="c-btn-dark-3"
class="c-btn-border-1x c-btn-dark-3"
class="c-btn-border-2x c-btn-dark-3"
class="c-font-dark-4"
class="c-border-dark-4"
class="c-bg-dark-4 c-bg-dark-4-font"
class="c-btn-dark-4"
class="c-btn-border-1x c-btn-dark-4"
class="c-btn-border-2x c-btn-dark-4"
