How to add custom styles to Bought theme in Magento2?

Question

I have applied a free theme on my magento2 store that don't have css file to edit custom styles. But it has less files like below,

app/design/frontend/<Vendor>/<theme>/web/css/source/_theme.less, _custom.less 

I tried below link to create custom theme in magneto2.

include css in magento2 for custom theme.

Where i added styles.css inside

web/css folder like below and whenever i add styles it affects on the website.

app/design/frontend/<Vendor>/<theme>/web/css/styles.css

But how to edit .less files to make work like the above one? Please anyone suggest how to work on css styles to the purchased themes?

Answer 1

Magento recomand to use less for better configuration and optimization, for that you need to use _extend.less .

Create it to this path:

app\design\frontend\vendor-name\theme-name\Magento_Theme\web\css\source\_extend.less

For better understanding you can review this link

Install Grunt after doing this by this link

Run grunt commands or the deploy command to see your changes on front side.