How can I style a quantity picker next to my add to cart button?

How can I style a quantity picker next to my add to cart button?

67 0 13

Hello, i need some help with some CSS customizations.


I have a add to cart button on my collection page, now i want a quantity picker beside it.

I have the code for that: 

<input type="number" name="quantity" min="1" value="6" />

The problem is that i can't make it look good. I thought maybe somebody here could help me style it a bit.

It could be the same design as my add to cart button with a white middle part where the quantity number should be.


The website is in Danish. "Læg i kurv" means add to cart. This is the buttons i am talking about 🙂

Can anybody help me style this?

My website is:



Screenshot 2023-06-16 at 14.27.22.png

Replies 3 (3)

Shopify Partner
4339 1116 1368

Hey @LauraOO 
If you're talking about the quantity picker on the collection page then it's not visible on the collection page but if you're talking about the quantity picker on the product page then, Follow these steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.


.QuantitySelector {
    background: #BE292E;
    color: white;




If I managed to help you then, don't forget to Like it and Mark it as Solution!


Best Regards,

Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Shopify Partner
30 1 6

Added quantity controller in the collection is more complicated than adding small HTML. It needs to have other logic like show quantity controller when clicking add to cart and hidden in quantity is less than 1. From your question, it seems like you might have figured out how to display the quantity controller but I don't see it using link above.

Skilled in building custom Shopify theme

Shopify Partner
3839 716 1177

Hi @LauraOO 


Adding a quantity selector can be a little complicated since it does only require html code. You need to add some liquid code. I suggest to hire someone to do this for you


If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free