Chakra UIでホバー時のボタンの背景色を変える
Chakra UIを使ってボタンを表示する際に、ホバー時にボタンの背景色を変えたかったのでやり方を調べた。
_hover 属性でホバー時の設定ができる。
<Button bg="#ff0000" _hover={{ bg: '#00ff00' }}>
Button
</Button>上記のボタンだと赤色のボタンが表示され、ホバーすると緑色に変化する。
参考
- How to set a hover color on Icons? · Issue #363 · chakra-ui/chakra-ui