tailwindcss

Links

background-image と gradient

bg-[linear-gradient(to_right,_white,_transparent),url('file-path')]

のようにも書けるが、 url() で相対パスを使う場合 CSS ファイル対する相対となる。

他の方法として mix-brend-xxx を使う方法がある。

Tailwind Tutorial | How to Handle Background Images, Gradients, and Overlays in Tailwind CSS

任意値を使う

Using arbitrary values

自動生成される HTML をいい感じにする

Official Plugin の @tailwindcss/typography を使う。

scrollbar のデザインを変更する

Adding variants で custom modifiers を登録して、それを使うようにする。

登録はtailwind.config.jsこのよう にして、 使う際は このよう にする。

refs. https://github.com/tailwindlabs/tailwindcss/issues/8200#issuecomment-1109690635