P5 Python Docs
  • Getting Started
  • Simple mode
  • Reference
    • Shapes
      • 2D
        • point()
        • line()
        • rect()
        • square()
        • triangle()
        • circle()
        • ellipse()
        • arc()
        • quad()
        • beginShape()
      • 3D
        • plane()
        • box()
        • sphere()
        • cone()
        • cylinder()
        • ellipsoid()
        • torus()
    • Controlling the environment
      • coordinateMode()
      • rectMode()
      • ellipseMode()
      • frameRate()
      • setup()
      • draw()
    • Built-in Variables
      • Environment
      • Keyboard
      • Mouse
    • Built-in Functions
      • keyIsDown()
      • millis()
      • second()
      • minute()
      • hour()
      • translate()
      • rotate()
      • createSlider()
      • createGraphics()
      • createVector()
    • Events
      • Keyboard
        • keyPressed()
        • keyReleased()
      • Mouse
        • mouseMoved()
        • mouseDragged()
        • mousePressed()
        • doubleClicked()
        • mouseWheel()
    • Text
      • text()
      • textSize()
      • textAlign()
    • Math
      • drawTickAxes()
      • random()
      • randomGaussian()
      • dist()
      • linmap()
      • bounce()
      • wave()
    • Colour and Outline
      • colorMode()
      • fill()
      • stroke()
      • strokeWeight()
      • background()
    • Images & Audio
      • loadImage() and image()
      • loadSound()
    • 3D Controls
      • orbitControl()
      • translate()
      • rotateZ()
      • rotateX()
      • rotateY()
      • scale()
Powered by GitBook
On this page
  1. Reference
  2. Controlling the environment

rectMode()

changes the way a rectangle is drawn from the inputs

PreviouscoordinateMode()NextellipseMode()

Last updated 2 years ago

By default, the x and y inputs refer to the bottom left corner of the rectangle.

This can be changed using rectMode(), with an input of CORNER, CORNERS, RADIUS or CENTER.

rectMode(CORNER)

This is the default mode. The code:

rect(x, y, width, height)

will use (x,y) as the bottom left corner coordinates and width and height as the dimensions.

rectMode(CORNERS)

This mode is for specifying the coordinates of opposite corners. The code:

rect(x1, y2, x2, y2)

will use (x1,y1) as the bottom left corner coordinates and (x2,y2) as the top right (diagonally opposite) corner coordinates.

rectMode(CENTER)

This mode is for specifying the center of the rectangle together with the width and height. The code:

rect(x, y, width, height)

will use (x,y) as the center coordinates and width and height as the dimensions.

rectMode(RADIUS)

This mode is for specifying the center of the rectangle together with half the width and half the height. The code:

See for examples and more info.

Find these documents helpful? Let the people who made them help your child learn to code at !

We'd love to hear your Feedback/Comments .

Strivemath
here
rect()