Tailwind CSS class .col-start-1 / .col-start-*

<div class="grid grid-cols-3 gap-4">
  <div class="col-start-2 col-span-2 h-4 bg-teal-400"></div>
  <div class="col-span-1 h-4 bg-teal-400"></div>
  <div class="col-auto col-end-4 h-4 bg-teal-400"></div>
  <div class="col-start-2 col-span-1 h-4 bg-teal-400"></div>
  <div class="col-span-1 h-4 bg-teal-400"></div>
</div>

.col-start-1 { grid-column-start: 1; }
.col-start-2 { grid-column-start: 2; }
.col-start-3 { grid-column-start: 3; }
.col-start-4 { grid-column-start: 4; }
.col-start-5 { grid-column-start: 5; }
.col-start-6 { grid-column-start: 6; }
.col-start-7 { grid-column-start: 7; }
.col-start-8 { grid-column-start: 8; }
.col-start-9 { grid-column-start: 9; }
.col-start-10 { grid-column-start: 10; }
.col-start-11 { grid-column-start: 11; }
.col-start-12 { grid-column-start: 12; }
.col-start-13 { grid-column-start: 13; }
.col-start-auto { grid-column-start: auto; }