Space Tourism Website solution using React js

I couldn't find a way to pass the url of each background image to scss and use media queries to change the background responsively. I didn't want to hard code the urls for all the different page backgrounds. Finally, I used styled components for changing the background images at different breakpoints which worked perfectly. Do you think it's a good practice to use both scss and styled components to style a webpage? Are there other options? I would like to hear them.