# Images

# Shape

Use the rounded, circle and thumbnail props to customise the image.


            const imageShapeInstance = (
              <Grid>
                <Row>
                  <Col xs={6} md={4}>
                    <Image src="/imgs/app/thumbnail.png" rounded />
                  </Col>
                  <Col xs={6} md={4}>
                    <Image src="/imgs/app/thumbnail.png" circle />
                  </Col>
                  <Col xs={6} md={4}>
                    <Image src="/imgs/app/thumbnail.png" thumbnail />
                  </Col>
                </Row>
              </Grid>
            );

            
          

# Responsive

Use the responsive to scale image nicely to the parent element.


            const imageResponsiveInstance = (
              <Image src="/imgs/app/responsive-image.jpg" responsive />
            );

            
          

# Props

NameTypeDefaultDescription
circlebooleanfalseSets image shape as circle
responsivebooleanfalseSets image as responsive image
roundedbooleanfalseSets image shape as rounded
thumbnailbooleanfalseSets image shape as thumbnail