JSFiddle - React, Tailwind, and code Playground

by blineberry

HTML

<figure>
    <img src="http://placekitten.com/50/50/" />
    <figcaption>Caption</figcaption>
</figure>

<figure>
    <img src="http://placekitten.com/50/50/" />
    <figcaption>Caption</figcaption>
</figure>

<figure>
    <img src="http://placekitten.com/50/50/" />
    <figcaption>Caption</figcaption>
</figure>

CSS

body {
  counter-reset: figure;
}

figcaption:before {
  content: "Figure " counter(figure) ": ";
  counter-increment: figure;
  font-weight: bold;
}