カードデザインとかで検索すれば、出てくると思います。
一応、簡単なサンプルを。
<style>
.card {
width: 300px;
margin: 10px;
background-color: #fff;
box-shadow: 0 2px 4px #ccc;
position: relative;
}
.card img.image {
width: 100%;
height: 200px;
object-fit: cover;
}
.card span.tag {
position: absolute;
top: 10px;
left: 10px;
color: #fff;
font-size: 0.8em;
background-color: #26C7C8;
border-radius: 15px;
padding:0 15px;
}
.card p {
margin: 0;
padding: 10px;
}
.card p.time {
font-size: 0.8em;
color: #b3b3b3;
}
.card p.title {
font-size: 1.2em;
color: #555;
}
</style>
<div class="card">
<img class="image" src="sample.jpg">
<span class="tag">アクセサリー/その他</span>
<p class="time">2018.10.20 Sat</p>
<p class="title">Air Pods</p>
</div>
