Material ui custom scrollbar

Question

How add custom scrollbar in material ui.?

I have search many things to add such scrollbar finally i have got this.

thank you everyone.

Answer 1

import React from "react";
import { Box} from "@material-ui/core";
import { makeStyles } from "@material-ui/core/styles";

const useStyles = makeStyles((theme) => ({
  root: {
    "&::-webkit-scrollbar": {
      width: 7,
    },
    "&::-webkit-scrollbar-track": {
      boxShadow: `inset 0 0 6px rgba(0, 0, 0, 0.3)`,
    },
    "&::-webkit-scrollbar-thumb": {
      backgroundColor: "darkgrey",
      outline: `1px solid slategrey`,
    },
  },
}));

export default const Customscroll= (props) => {
  const classes = useStyles();

  return (
    <Box  className={classes.root}>
    </Box>
  );

};