CSS Editor
This module allows users to customize a theme's CSS directly through a web browser. It provides a rich text editor with syntax highlighting and a live preview of changes, with options to enable this feature for specific themes.
This module allows site builders to customize a theme's CSS through the browser, using a rich text editor with syntax highlighting and live preview.
The module has just one option in its configuration page: you choose which themes can use the custom CSS feature. So, on the settings page of each theme enabled to use this feature, a textarea is displayed where you enter custom CSS code. You can choose to use a plain textarea or an editor with syntax highlighting (default). You can also preview the changes live while you type. This can be disabled as well (default is enabled). The feature can be enabled to multiple themes on the same site, and all can be live-previewed, not only the default one. The custom CSS code is injected after all other CSS.
Check this video to understand better how it works.