You can make a <style> tag display: block and add contenteditable, and you can edit it inline

How to make a editable inline style tag

• Add a <style>...</style>
• Then add contenteditable to it (<style contenteditable>...</style>)
• And use CSS to display it: style { display: block; }

Try editing the CSS below... Inspect it to see it is a normal style tag...

Example h1 to format... (change the above, e.g. to color: blue to see it updated here

There are some limitations... If you enter a new line, contenteditable will add P/DIV tags. You can get around this with some JS (listen for keydown, stopPropagation, manually set inner text content. This page currently has no JS to help with this. It is just a demo of editable style tags.

Source code for editable css style tags... The important part is the display: block CSS, and contenteditable