Hello SenangStart!
Zero config, instant styling.
```
**Documentation**: [Getting Started Guide](https://bookklik-technologies.github.io/senangstart-css/guide/getting-started.html)
# Cards (Icon Start Outline)
Category: layout
Description: Cards (Icon Start Outline)
## SenangStart CSS Code
```html
<div layout="flex col" space="p:medium-3x" visual="border-w:thin border:neutral-200 rounded:medium hover:border:blue-400 transition:colors">
<div layout="flex items:center justify:center" space="w:big-2x h:big-2x m-b:medium" visual="bg:blue-50 text:blue-600 rounded:medium text-size:huge">
<i class="ss ss-cube"></i>
</div>
<h6 space="m-b:small" visual="font:tw-semibold text-size:base tw-lg:text-size:large text:gray-900">
Card title here...
</h6>
<p visual="text:gray-600 text-size:small tw-lg:text-size:base">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
```
## Tailwind CSS Code
```html
<div class="border border-neutral-200 rounded-lg p-6 flex flex-col hover:border-blue-400 transition-colors">
<div class="bg-blue-50 text-blue-600 w-14 h-14 rounded-lg mb-4 flex items-center justify-center text-2xl">
<i class="fas fa-cube"></i>
</div>
<h6 class="mb-2 font-semibold text-base lg:text-lg text-gray-900">
Card title here...
</h6>
<p class="text-gray-600 text-sm lg:text-base">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
```