FORM UI CSS

file inputのボタン部分だけ、 CSSで整える

::file-selector-button を使うと、ファイル選択の標準UIを活かしながら、 ボタン部分だけブランドカラーに寄せられます。

Brand color 標準のfile inputを活かして、ボタンだけ整えます
Default

標準の見た目

Styled

ボタン部分だけ整える

Point

ファイル選択の挙動は標準UIに任せて、ボタン部分だけCSSで調整できます。