Edit (Change) CSS file using browser developer tool

Hello,

I have this .css file i want user can change the color through color picker and change replaces in .css file.

I want to change the css file from browser so user can change css color name or font size and save it.

For e.g. currently the below color are green user open the page select the color from color picker and save and changes applied to .css file tags we define.

Please advice

:root {
    --body-f: rgb(56, 64, 71);
    /*-------------------------------*/
    --top-h-bg: #f4f4f7;
    --top-h-c: rgb(56, 64, 71);
}