A modern Bootstrap 5.2 card design

A modern-looking Bootstrap card element built with Bootstrap version 5.2

Usually the default Bootstrap card has a very defined header and footer consisting of a border and shaded background. This modern take removes this blocky look and adds a drop-down for quick actions.

The footer text has a faded colouring so as to not stand out, this is perfect for dates or authors’ names. There is a status badge to distinctively show a status with colour and text.

This modern card element has the following features:

• Standout heading
• Dropdown for instant actions
• Datetime/author footer text
• Coloured status badge

Live view and source code on CodePen.