I have a very frustrating issue with the Magento 2 sales order emails. Through experimentation, I worked out the locations of the many files that are used to comprise these emails.

At some point, I edited what I believe was


to alter the CSS there to check if that makes a difference to the resulting sales emails.

The confusion I have is that sometimes editing this seems to influence the resulting emails, sometimes not.

My question is, how do I clarify for sure what .less / .css files are being used as the source for the CSS that I believe is embedded into emails. I'm not sure if the normal css that is in the pub/static folders of magento comes into this or not. Clarification about the exact source files for email css would be great.

  • where you able to read this devdocs.magento.com/guides/v2.3/frontend-dev-guide/css-topics/… ? – fmsthird Oct 15 '19 at 5:07
  • Yes I had @fmsthird, what I'd like is for someone to clarify in summary how the css is compiled into emails. I understand the basic idea of how .less files are compiled into the public static folders to produce final css but for emails I am less clear what files are being referenced in the generation of the emails and if the static folder actually has anything to do with this. – AdamJones Oct 17 '19 at 19:36

Confusingly looks like a mixture of places

Have you tried viewing the source of one of your emails

A forgotten password email I generated using Luma US theme from the admin pulled this via import statement

@import url("http://magento2.docker/static/version1571346637/frontend/Magento/luma/en_US/css/email-fonts.css");

So pub/static

But then I spotted blockquote cite{font-style:normal} which is a bit unusual and easy to search for.

I found this inside


which is built from


I've read you can override these

Add your custom styles here for common emails: 

Add your custom less variables here for common emails : 

Add your custom styles here for sales emails : 

Note: I'm a backend dev. I won't be able to confirm this for you but logically makes sense.


Found this in Magento Documentation this might be a good read. This explains at least How to Style Email Templates and how email styles are organized.


You need to override below two css files from Magento default blank theme to you custom theme and editing those files.



Your custom theme css path will be below




and for sales email


you can check this magento devdoc link for reference.


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.