I want to load all extension's css before custom theme css in <head> tag. Right now extension's css file are loading after styles-m.css and styles-l.css so I can not override the extension css from my custom theme css.

2 Answers 2


There are two ways:

1> All css load depending on order in app/etc/config.php. You can move your module before Magento_theme module then it will load all css of your custom module before your theme css. But in this case when you run setup:upgrade command then again your order will change.

2> You can create your custom module but the first latter of your namespace must be after M latter because order of module in config.php by default sort by alphabatically. Here you can write your custom css for override all css.


For Module-specific styles, Retrive the directory : /_/web/css Then Modify /source/_theme.less: overrides the default Magento UI library variables values.

Include css:

Your custom default_head_blocks.xml should be located as follows: /Magento_Theme/layout/default_head_blocks.xml. To include a CSS file, add the /" media="print|"/> block in section in a layout file. is specified relative to the theme web directory (/web) For example, the following illustrates how

stylesheets are included in the default Blank theme:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
      <css src="css/styles-m.css" />
      <css src="css/styles-l.css" media="screen and (min-width: 768px)"/>
      <css src="css/print.css" media="print" />

For More understanding, see the below URL:


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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