justify-content: space-between;
<div class="legend-item-wrapper">
<span class="legend-label">0</span>
<div class="legend-item-wrapper">
<span class="legend-label">10</span>
<div class="legend-item-wrapper">
<span class="legend-label">500</span>
<div class="legend-item-wrapper">
<span class="legend-label">1k</span>
<div class="legend-item-wrapper">
<span class="legend-label">10k</span>
<div class="legend-item-wrapper">
<div class="legend-label">100k</div>
<div class="legend-row" style="height: 28px;">
<div class="legend-item-wrapper">
<div class="point" style="background-color: #ffffd4; width: 8px; height: 8px;"></div>
<div class="legend-item-wrapper">
<div class="point" style="background-color: #fee391; width: 12px; height: 12px;"></div>
<div class="legend-item-wrapper">
<div class="point" style="background-color: #fec44f; width: 16px; height: 16px;"></div>
<div class="legend-item-wrapper">
<div class="point" style="background-color: #fe9929; width: 20px; height: 20px;"></div>
<div class="legend-item-wrapper">
<div class="point" style="background-color: #d95f0e; width: 24px; height: 24px;"></div>
<div class="legend-item-wrapper">
<div class="point" style="background-color: #993404; width: 28px; height: 28px;"></div>