Cards

The traditional content block for showing article excerpts, like those from a blog.

Rounded with Shadow

April 7, 2020

Lorem ipsum dolor sit amet, consectetur

Anim ullamco anim ipsum Lorem id voluptate consequat excepteur proident cillum mollit. Tempor eiusmod fugiat minim Lorem.

Learn more →
<table class="w-1/2 sm:w-full font-sans shadow-xl rounded">
  <tr>
    <td>
      <img class="rounded-tl rounded-tr" src="https://images.unsplash.com/photo-1524758631624-e2822e304c36?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=600&h=300&q=80" alt="">
    </td>
  </tr>
  <tr>
    <td class="bg-white p-20 rounded-br rounded-bl">
      <span class="text-xs text-cool-gray-500">April 7, 2020</span>
      <h2 class="mt-8 mb-12 text-2xl leading-full">
        <a href="https://example.com" class="text-black hover:text-cool-gray-700 no-underline">Lorem ipsum dolor sit amet, consectetur</a>
      </h2>
      <p class="m-0 mb-16 text-base text-cool-gray-500">Anim ullamco anim ipsum Lorem id voluptate consequat excepteur proident cillum mollit. Tempor eiusmod fugiat minim Lorem.</p>
      <a href="https://example.com" class="text-blue-500 no-underline hover:underline">Learn more &rarr;</a>
    </td>
  </tr>
</table>