Color helper classes
Right now Smelte adds very little to what Tailwind has to offer dealing with color except for porting the Material design color palette and adding a few extra utilities like caret color on inputs or colored ripple animation effect. Colors themselves are configured in tailwind.config.js .
Background
.bg-{color}-{variant} gives element appropriate background color:<div class="bg-deep-purple-500 text-white p-4">This div is deep purple.</div>This div is deep purple.
Text
.text-{color}-{variant} changes text color accordingly:<h4 class="text-error-500">This header is error</h4>This header is error color
Border
Same principle applies to border, but there are also border width border-{n} and type border-{solid|dashed|dotted|none} helpers.<div class="border-2 border-secondary-600 p-4">This div has secondary border</div>This div has secondary color border