Atoms are the basic building blocks for all UI components. In SIP, the atoms consist of color styles, text styles, buttons, glyphs, icons, logos, banners, tags, and other miscellaneous tools like cursor pointers and scroll bars.
The hexadecimal color values were created using SASS lighten and darken functions. To see how they were generated, check out this CodePen:
http://cdpn.io/e/NWPerXp.
To see the buttons live in action, check out this CodePen:
http://cdpn.io/e/rPQjyq.