Quick component I put together that gives you some shapes you can use in the UI.

React Shape Component - TypeScript

import React, { FC } from 'react';

interface ShapeInterface {
  type: 'rectangle' | 'circle' | 'triangle',
  backgroundColor?: string
  style?: { [key: string]: any }
}

const Shape: FC<ShapeInterface> = ({ type, backgroundColor = '#252525', style }): JSX.Element => {

  const styles = {
    'rectangle': {
      width: '200px',
      height: '100px',
      backgroundColor
    },
    'circle': {
      width: '100px',
      height: '100px',
      borderRadius: '50%',
      backgroundColor,
    },
    'triangle': {
      width: '0',
      height: '0',
      borderLeft: '50px solid transparent',
      borderRight: '50px solid transparent',
      borderBottom: `100px solid ${backgroundColor}`
    }
  }

  return <div className='shape' style={{
    ...style,
    ...styles[type]
  }} />
}

export { Shape }