Can these arrows be removed?

Topic summary

A user wants to remove two types of arrows from their Shopify store:

1. Arrows on feature category cards (displayed on pages)

2. Dropdown arrows in the navigation menu

Two solutions were provided using custom CSS code:

  • Solution 1: Insert CSS code in the theme.liquid file above the </head> tag to hide the arrows
  • Solution 2: Add CSS code to the base.css file targeting specific classes (.header__menu-item .icon-caret, .card .icon-wrap, .menu-drawer__menu-item > .svg-wrapper)

Both approaches use display: none !important; to hide the arrow elements. The solutions require accessing Shopify Admin → Online Store → Themes → Edit Code.

Status: Multiple working solutions provided with code snippets and visual examples of expected results.

Summarized with AI on November 4. AI used: claude-sonnet-4-5-20250929.

I want to remove the arrows..

  1. Feature categories on my pages (Screen Shot 1)

  2. Drop down arrow on Nav Menu (Screen Shot 2 and 3)

I’m not tech savvy so be kind :rofl:

Hi, @AussieBoltNut

Can you share your store url? So that I can assist you.

@AussieBoltNut ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above


Result:

If it helps you, please like and mark it as the solution.

Best Regards

Hello @AussieBoltNut
Go to online store ----> themes ----> actions ----> edit code ---->base.css
add this code at the end of the file and save.

.header__menu-item .icon-caret {
display: none !important;
}
.card .icon-wrap {
display: none !important;
}
.menu-drawer__menu-item > .svg-wrapper {
display: none !important;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks