The Text section of the cart drawer editor has three size controls, all in pixels. They set the hierarchy of the drawer's numbers, which is what customers look at first.
The three controls
Control | What it sizes |
| The price on each cart item |
| The crossed-out original price |
| The subtotal above the checkout button |
Setting a sensible hierarchy
The three sizes should not be equal. Each has a different job.
Element | Relative size | Why |
Subtotal | Largest | It is the number the customer is deciding on |
Price | Medium | Per-item context |
Compare price | Smallest | Reference only, and it should not compete with the real price |
A workable starting point on most themes: subtotal a few pixels larger than price, and compare price a few pixels smaller.
💡 If you are unsure, match your theme's product page. Customers moving from the product page to the cart should not feel the typography change, and your theme's sizes are already tuned for your fonts.
Checking on mobile
Cart drawers are narrow, and most carts are opened on a phone.
Use the preview with Show items in cart on and check that:
prices do not wrap onto a second line
the price and compare price sit together without colliding
the subtotal is readable without zooming
long product titles do not push prices out of alignment
⚠️ Do not go below roughly 12px for anything a customer needs to read. Small text fails accessibility guidance and is genuinely hard to read on a phone in daylight.
What is not here
Font family and font weight are not configurable for the cart drawer. It inherits your theme's fonts, which is usually what you want: the drawer matches your store without any work.
Colours are configured separately, in the Colors section. See Customizing cart drawer colours.
The text content itself, including the cart title and button labels, is in General Settings. See Setting your cart title, buttons and empty state.