var(--var_name) styles css

Is there any nice way to set var(--var_name) like

<p style='font:var(--var_name)'> what a style</p> <script> // set it below and read it in nice way var(--var_name)='Dancing Script' // << this is nice line var read_it=var(--var_name) // << and this is nice line </script>

like

<style> :root{ --var_name='Brush Script' } </style>

There are very bad looking other ways in code to do that not a nice and simple