Hello SenangStart!
Zero config, instant styling.
```
**Documentation**: [Getting Started Guide](https://bookklik-technologies.github.io/senangstart-css/guide/getting-started.html)
# Cards (Icon Start Filled)
Category: layout
Description: Cards (Icon Start Filled)
## SenangStart CSS Code
```html
<div layout="flex col" space="p:medium-3x" visual="bg:gray-100 rounded:medium hover:bg:gray-200 transition:colors">
<div layout="flex items:center justify:center" space="w:big-2x h:big-2x m-b:medium" visual="bg:blue-600 text:white rounded:medium text-size:huge shadow:small">
<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="bg-gray-100 rounded-lg p-6 flex flex-col hover:bg-gray-200 transition-colors">
<div class="bg-blue-600 text-white w-14 h-14 rounded-lg mb-4 flex items-center justify-center text-2xl shadow-sm">
<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>
```