Urgency & scarcity Free

Live inventory stock bar

A visual bar showing how much real stock is left for a variant, filling less as inventory runs down.

{%- comment -%} Treat this many units as a "full" bar {%- endcomment -%}
{%- assign full_at = 20 -%}
{%- assign variant = product.selected_or_first_available_variant -%}
{%- if variant.inventory_management and variant.available and variant.inventory_quantity > 0 -%}
  {%- assign qty = variant.inventory_quantity -%}
  {%- if qty > full_at -%}{%- assign qty_capped = full_at -%}{%- else -%}{%- assign qty_capped = qty -%}{%- endif -%}
  {%- assign pct = qty_capped | times: 100 | divided_by: full_at -%}
  <div class="stock-bar">
    {%- if qty <= 10 -%}<p class="stock-bar__label">Only {{ qty }} left in stock</p>{%- endif -%}
    <div class="stock-bar__track"><div class="stock-bar__fill" style="width: {{ pct }}%"></div></div>
  </div>
{%- endif -%}
<style>
  .stock-bar{margin:12px 0;font-size:13px}
  .stock-bar__label{margin:0 0 6px;font-weight:600;color:#b32d2e}
  .stock-bar__track{height:6px;background:#eee;border-radius:99px;overflow:hidden}
  .stock-bar__fill{height:100%;background:#b32d2e}
</style>

Turns a raw stock number into a glanceable urgency cue, driven entirely by real inventory. Paste into main-product.liquid below the price.

Notes

Renders only when inventory is actually tracked (inventory_management) and above zero, so the bar reflects true stock — no invented scarcity.
Set full_at to what counts as a healthy stock level for your catalog; the bar is capped at that.
For multi-variant products, re-render on variant change so the bar tracks the selected variant.