Idea of CSS in JS lib syntax

index.jsx

import { css, hover, setTheme, theme } from 'csx';
import { dark, light } from './themes';

setTheme(light);

const highlight = css({
  color: 'red',
  backgroundColor: theme.background,

  hover: {
    color: 'orangered',
  },
});

function App() {
  return (
    <div>
      <h1 className={highlight}>
        Hello world
      </h1>
      <button onClick={() => setTheme(dark)}></button>
    </div>
  );
}

themes.js

export const dark = {
  background: '#333',
};

export const light = {
  background: '#fff',
};