In responsive mode, I can inspect element to see class and values of the search icon.

However in "desktop" mode, when inspecting element I haven't found the corresponding class to edit the search icon.

I know magento 2 uses font icons. I don't want to replace the icon. I just want to edit the color and size.

I created a custom theme which inherits from the Blank magento theme.

  • Which template are you using? – Akif Aug 10 '16 at 21:31
  • A custom theme which inherits from the Blank theme – Luis Garcia Aug 11 '16 at 1:54

Just add the below css:

.block-search .action.search:before {
    font-size: 20px;
    color: red;

I find the icon seems to dim for me however not quite sure why yet.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.