How to Add Custom LESS File in Custom Theme in Magento 2

In this tutorial, Today I will explain to how to add custom LESS file in custom theme in Magento 2. When you create custom theme, then you need to add core LESS fle inside your custom theme. Sometimes, you must need to create your custom less file for your custom theme. At that time, You just created less file and check after deploy but, your changes not reflacted.

So, It’s happen because you didn’t add custom less file. Now, just follow the below way :

You may also like this :

1) Let’s assume that you have created custom theme. Now, Create your custom less file at app/design/frontend/VendorName/ThemeName/web/css/source/_custom.less and add your less code inside that file.

2) After that you need to import this _custom.less file at app/design/frontend/VendorName/ThemeName/web/css/source/_sources.less

Copy Code


@import '_custom.less';

You need to import your _custom.less file using this above line. Just add that line inside _sources.less file. If this _sources.less file not exist in your custom theme then, you need to copy file from vendor/magento/theme-frontend-blank/web/css/source/_sources.less file in your theme.

Now, just need to deploy and clean cache.

Copy Code

php bin/magento s:up php bin/magento s:s:d -f php bin/magento c:c

That’s it !!!

I hope this blog is easy to understand about how to add custom LESS file in custom theme in Magento 2. In case, I missed anything or need to add some information, always feel free to leave a comment in this blog, I’ll get back with proper solution.

Keep liking and sharing !!

Post Views: 5,159