Colors
The color system in ajcss is simple and very easy to use and internalize. The best way to demonstrate it is with an example.
Example: Text COLORS!
Primary Color
Dark Red
Red
Yellow
Green
Dark Green
Navy
Dark Blue
Blue
Purple
Light Purple
Dark Pink
Pink
Hot Pink
Black
Near Black
Dark Gray
Mid Gray
Gray
Silver
Light-Silver
Moon Gray
Light Gray
Near White
White
<![CDATA[
<div class="primary">Primary Color</div>
<div class="dark-red">Dark Red</div>
<div class="red">Red</div>
<div class="yellow">Yellow</div>
<div class="green">Green</div>
<div class="dark-green">Dark Green</div>
<div class="navy">Navy</div>
<div class="dark-blue">Dark Blue</div>
<div class="blue">Blue</div>
<div class="purple">Purple</div>
<div class="light-purple">Light Purple</div>
<div class="dark-pink">Dark Pink</div>
<div class="pink">Pink</div>
<div class="hot-pink">Hot Pink</div>
<div class="black">Black</div>
<div class="near-black">Near Black</div>
<div class="dark-gray">Dark Gray</div>
<div class="mid-gray">Mid Gray</div>
<div class="gray">Gray</div>
<div class="silver">Silver</div>
<div class="light-silver">Light-Silver</div>
<div class="moon-gray">Moon Gray</div>
<div class="light-gray">Light Gray</div>
<div class="near-white">Near White</div>
<div class="white">White</div>
]]>
Example: Background COLORS!
Primary Color Background
Dark Red Background
Red Background
Yellow Background
Green Background
Dark Green Background
Navy Background
Dark Blue Background
Blue Background
Purple Background
Light Purple Background
Dark Pink Background
Pink Background
Hot Pink Background
Black Background
Near Black Background
Dark Gray Background
Mid Gray Background
Gray Background
Silver Background
Light-Silver Background
Moon Gray Background
Light Gray Background
Near White Background
White Background
<![CDATA[
<div class="p2 bg-primary">Primary Color Background</div>
<div class="p2 bg-dark-red">Dark Red Background</div>
<div class="p2 bg-red">Red Background</div>
<div class="p2 bg-yellow">Yellow Background</div>
<div class="p2 bg-green">Green Background</div>
<div class="p2 bg-dark-green">Dark Green Background</div>
<div class="p2 bg-navy">Navy Background</div>
<div class="p2 bg-dark-blue">Dark Blue Background</div>
<div class="p2 bg-blue">Blue Background</div>
<div class="p2 bg-purple">Purple Background</div>
<div class="p2 bg-light-purple">Light Purple Background</div>
<div class="p2 bg-dark-pink">Dark Pink Background</div>
<div class="p2 bg-pink">Pink Background</div>
<div class="p2 bg-hot-pink">Hot Pink Background</div>
<div class="p2 bg-black">Black Background</div>
<div class="p2 bg-near-black">Near Black Background</div>
<div class="p2 bg-dark-gray">Dark Gray Background</div>
<div class="p2 bg-mid-gray">Mid Gray Background</div>
<div class="p2 bg-gray">Gray Background</div>
<div class="p2 bg-silver">Silver Background</div>
<div class="p2 bg-light-silver">Light-Silver Background</div>
<div class="p2 bg-moon-gray">Moon Gray Background</div>
<div class="p2 bg-light-gray">Light Gray Background</div>
<div class="p2 bg-near-white">Near White Background</div>
<div class="p2 bg-white">White Background</div>
]]>
So there are a lot of colors. ¯\_(ツ)_/¯