How to style dynamically in lit?

You can't use ‍${} in lit css tag function!

But you can select element and then change style

import {html, css, LitElement} from 'lit';
import {customElement, property, query} from 'lit/decorators.js';

@customElement('dynamic-style')
export class DynamicStyle extends LitElement {
  static styles = css`
    label {
      color: #023047;
    }
  `;

  @property()
  color: string;

  @query('input') input: HTMLSelectElement | undefined;
  @query('label') label: HTMLSelectElement | undefined;

  render() {
    return html`
      <label
        >Enter HEX color
        <input class="color-input" placeholder="#023047" />
      </label>
    `;
  }

  firstUpdated() {
    this.input.addEventListener('input', () => {
      this.label.style.color = this.input.value;
    });
  }
}

lit playground

Also read: Dynamic classes and styles | Lit Doc

Use CSS variable in Lit

Simply! It is good to search more and then ask