How to quickly test and add custom CSS code in WordPress ?

The  Additional CSS Panel provides a really powerful tool for applying simple CSS changes and seeing the effect immediately. This is a really useful feature to test different style with various CSS code in real-time preview.

Open the WordPress live customizer and navigate to the custom css setting.

Just remember to click the Save & Publish button to keep your changes.

Using the WordPress Custom CSS has many benefits

  • If you modify a theme directly and it is updated, then your modifications may be lost. By using Custom CSS you will ensure that your modifications are preserved.
  • Using Custom CSS can speed up development time.
  • Custom CSS is loaded after the theme’s original CSS and thus allows overriding specific CSS statements, without having to write an entire CSS set from scratch.

source : https://codex.wordpress.org/CSS#Custom_CSS_in_WordPress