Libraries

LIBRARIES

Consider using Font Awesome / Google Material UI for symbols and ui components (both are compatible with React)

Font Awesome seem to have the better icons

Font Awesome: https://fontawesome.com/search?q=stopw&o=r

Material UI for React: https://mui.com/material-ui/material-icons/?query=settings

React Native should use react-native-vector-icons

Prism.js

MUI Icon Library

Primarily for React

  • Icon library: mui.com/material-ui/material-icons/
  • Installation: only install the icon library to reduce the dependencies
    • Main icon library: npm install @mui/icons-material
    • Other libraries if using MUI themes or other components: @mui/material, @emotion/styled, @emotion/react
    • Useful Icons: Contrast, Menu, MoreVert, Grip
    • Overriding MUI styles with !important is needed for properties: display:none and background color when hovering
  • Use them like normal components
    • import HomeIcon from "@mui/icons-material/Home";

export default function MyComponent() {
  return (
    <div>
      <h1>Dashboard</h1>
      <HomeIcon className='homeBtn' style={{ fontSize: 40, color: "blue" }} />
    </div>
  );
}