I am working on magento-2 version with Luma theme.

I would like to change the footer background color from #f4f4f4 to my desired color.

I found the path is

line 616

I found the property here that .page-footer default background is #f4f4f4.

at line 616:

.page-footer { i added the new background color }

But this did not work. am I in the right area?

How do I change the color?

  • Did you recompile the less after you made the change? – philwinkle Apr 7 '16 at 22:45
  • yes several times - cleared all the cache delete all the static folders and also ran this this bin/magento setup:static-content:deploy – roger Apr 8 '16 at 14:27

I made changes in _variables.less file i.e (/app/design/frontend/web/css/source/_variables.less)

@footer__background-color: #ff0000; (RED)

Please try below command:

php bin/magento clear:cache
php bin/magento cache:flush
php bin/magento setup:static-content:deploy

I hope your changes will be reflect.


Install grunt delete view_preprocessed under var directory after that run

> grunt clean:<theme_name>
> grunt less:<them_name>

Try it by giving background: #f4f4f4 !important


I changed it by adding the following to _theme.less in my theme.

/app/design/frontend///web/css/source/_theme.less add the following (change #ffffff to your desired color)

@footer__background-color: #ffffff;

After you move that file to your server, you need to flush your static files cache (easiest way is in admin: System > Cache Management and scroll down to "Flush Static Files Cache")

Worked for me.. hopefully this helps!


Add the following css at your css file:

  background: #f4f4f4 !important;

After this please clear the cache.


Please try below command:

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

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.