Magento2 CSS Images – Where to Put Images to Use in CSS

cssimagelocationsmagento2

What is the best location to put the images that I use in my custom css file? And what is the best way to get to the image from the css file?

The location of my custom css is:
app/design/frontend/theme/themename/web/css

I have Magento in developer mode.

Magento does something when deploying the files and I don't know if the location of css and image will change…

Regards,
Robert

Best Answer

You have to keep images in below path

app/design/frontend/Vendor/YourTheme/web/images

So the full path for image demo.jpg will be

app/design/frontend/Vendor/YourTheme/web/images/demo.jpg

Your CSS file path for custom.css

app/design/frontend/Vendor/YourTheme/web/css/custom.css

Now you can use that demo.jpg image in the custom.css file as below

.test{background: url('../images/demo.jpg');}

Now run the below commands

php bin/magento setup:static-content:deploy -f

php bin/magento cache:flush

Related Topic