Dark Mode
backgroundLayer 1
Components and their props
  • Fab
    • ripple true/false
      Adds riple effect to the fab.
    • exited true/false
      Adds exited animated effect to fab.
    • mini true/false
      Shrinks the size of the fab.
    • primary true/false
      Adds primary color to button
    • secondary true/false
      Adds secondary color to button
Sample code
import {h, Component} from 'preact';
import Fab from 'preact-material-components/Fab';
import 'preact-material-components/Fab/style.css';

export default class FabPage extends Component {
    return (
        <Fab ripple={true}>
        <Fab mini={true}>
Original documentation
This component encapsulates mdc-fab, you can refer to its documentation here.
<Fab ripple={true}><Fab.Icon>favorite_border</Fab.Icon></Fab>
<Fab mini={true}><Fab.Icon>favorite_border</Fab.Icon></Fab>
<Fab exited><Fab.Icon>directions_run</Fab.Icon></Fab>