このツールについて
CSS から JS スタイルオブジェクトへのツールは、CSS のブロックを React インラインスタイルや styled-components、Emotion のような CSS-in-JS ライブラリに適した JavaScript オブジェクトに変換します。宣言はブラウザ内でローカルに解析され、何もアップロードされないため、スタイルシートをインラインスタイルへ移行するのは貼り付けとコピーだけで済みます。
各プロパティ名は camelCase 化されます。background-color は backgroundColor に、z-index は zIndex になります。ベンダープレフィックスは React のルールに従います。先頭の -ms- は ms に小文字化され（msFilter）、-webkit-、-moz-、-o- はそれぞれ Webkit、Moz、O に大文字化されます（WebkitBoxShadow）。カスタムプロパティ（--brand-color）はクォートされたキーとしてそのまま保持されます。値は既定で文字列として出力され、単位や !important が保たれます。数値トグルにより、素の整数や小数を代わりにクォートなしの数値にできます。有効な JavaScript 識別子であるキーはクォートなしのままで、残りは自動的にクォートされます。
入力がプレーンな宣言ブロック（セレクターなし）の場合、1 つのフラットなオブジェクトを生成し、React の style prop に最適です。入力がセレクターを含む完全なルールの場合、styled/Emotion モードは各セレクター文字列をキーとするネストしたオブジェクトを出力します。これはそれらのライブラリが受け付けるオブジェクト構文です。出力の const 名を制御でき、全体は const styles = { ... }; として書き出され、貼り付ける準備が整います。