Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Marcussacapuces91/doc-TFT_eSPI/llms.txt

Use this file to discover all available pages before exploring further.

TFT_eSPI provides a complete set of fill methods that paint the interior of shapes with a solid colour, a gradient, or an anti-aliased smooth finish. These complement the outline-only methods on the Drawing Shapes page. All coordinates use screen pixels with (0, 0) at the top-left of the current rotation. Colours should be 16-bit RGB565 values or TFT_* colour constants unless the method signature specifies uint32_t, in which case a 24-bit value is also accepted.

​
fillScreen() — Clear / Fill Entire Screen

void fillScreen(uint32_t color)
Fills the entire visible screen area (within the current rotation) with a solid colour. This is the fastest way to clear the display.
​
color
uint32_t
Fill colour. Use a TFT_* constant (e.g. TFT_BLACK) or an RGB565 value.
#include <TFT_eSPI.h>

TFT_eSPI tft = TFT_eSPI();

void setup() {
  tft.init();
  tft.setRotation(1);
  tft.fillScreen(TFT_BLACK); // clear to black
}

​
fillRect() — Filled Rectangle

void fillRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color)
Draws a solid filled rectangle. The top-left corner is at (x, y).
​
x
int32_t
X coordinate of the top-left corner.
​
y
int32_t
Y coordinate of the top-left corner.
​
w
int32_t
Rectangle width in pixels.
​
h
int32_t
Rectangle height in pixels.
​
color
uint32_t
Fill colour.
tft.fillRect(20, 20, 100, 60, TFT_RED);

​
fillRoundRect() — Filled Rounded Rectangle

void fillRoundRect(int32_t x, int32_t y, int32_t w, int32_t h,
                   int32_t radius, uint32_t color)
Draws a solid filled rectangle with rounded corners.
​
x
int32_t
X coordinate of the bounding box top-left corner.
​
y
int32_t
Y coordinate of the bounding box top-left corner.
​
w
int32_t
Width of the rectangle.
​
h
int32_t
Height of the rectangle.
​
radius
int32_t
Corner arc radius in pixels.
​
color
uint32_t
Fill colour.
tft.fillRoundRect(10, 10, 120, 80, 12, TFT_BLUE);

​
fillSmoothRoundRect() — Anti-Aliased Filled Rounded Rectangle

void fillSmoothRoundRect(int32_t x, int32_t y, int32_t w, int32_t h,
                         int32_t radius, uint32_t color,
                         uint32_t bg_color = 0x00FFFFFF)
Draws a solid filled rounded rectangle with anti-aliased edges. Edge pixels are blended with bg_color. If bg_color is omitted (0x00FFFFFF), the background colour is read from the display for each edge pixel.
​
x
int32_t
X coordinate of the top-left corner.
​
y
int32_t
Y coordinate of the top-left corner.
​
w
int32_t
Rectangle width.
​
h
int32_t
Rectangle height.
​
radius
int32_t
Corner arc radius.
​
color
uint32_t
Fill colour.
​
bg_color
uint32_t
Background colour for edge anti-aliasing. Default 0x00FFFFFF causes the background to be read from the TFT display.
tft.fillSmoothRoundRect(10, 10, 120, 80, 12, TFT_GREEN, TFT_BLACK);

​
fillCircle() — Filled Circle

void fillCircle(int32_t x, int32_t y, int32_t r, uint32_t color)
Draws a solid filled circle.
​
x
int32_t
X coordinate of the centre.
​
y
int32_t
Y coordinate of the centre.
​
r
int32_t
Radius in pixels.
​
color
uint32_t
Fill colour.
tft.fillCircle(120, 120, 50, TFT_WHITE);

​
fillSmoothCircle() — Anti-Aliased Filled Circle

void fillSmoothCircle(int32_t x, int32_t y, int32_t r,
                      uint32_t color, uint32_t bg_color = 0x00FFFFFF)
Draws a solid filled circle with anti-aliased edges blended against bg_color.
​
x
int32_t
X coordinate of the centre.
​
y
int32_t
Y coordinate of the centre.
​
r
int32_t
Radius in pixels.
​
color
uint32_t
Fill colour.
​
bg_color
uint32_t
Background colour for anti-aliasing. Default 0x00FFFFFF reads from the display.
tft.fillSmoothCircle(120, 120, 50, TFT_CYAN, TFT_BLACK);

​
fillCircleHelper() — Quadrant Fill Helper

void fillCircleHelper(int32_t x, int32_t y, int32_t r,
                      uint8_t cornername, int32_t delta, uint32_t color)
Support function used internally by fillRoundRect(). Fills one or more quadrant sectors of a circle. The cornername bitmask selects which sides to fill, and delta extends the fill vertically to connect the straight sides of a rounded rectangle.
​
x
int32_t
X coordinate of the circle centre.
​
y
int32_t
Y coordinate of the circle centre.
​
r
int32_t
Radius in pixels.
​
cornername
uint8_t
Bitmask selecting which side to fill (0x1 = right side, 0x2 = left side).
​
delta
int32_t
Vertical extension for connecting horizontal span to rounded rect body.
​
color
uint32_t
Fill colour.
fillCircleHelper() is a low-level support function. Prefer fillRoundRect() or fillCircle() for typical use.

​
fillEllipse() — Filled Ellipse

void fillEllipse(int16_t x, int16_t y, int32_t rx, int32_t ry, uint16_t color)
Draws a solid filled axis-aligned ellipse.
​
x
int16_t
X coordinate of the centre.
​
y
int16_t
Y coordinate of the centre.
​
rx
int32_t
Horizontal radius (semi-axis along X).
​
ry
int32_t
Vertical radius (semi-axis along Y).
​
color
uint16_t
Fill colour.
tft.fillEllipse(120, 120, 60, 30, TFT_WHITE);

​
fillTriangle() — Filled Triangle

void fillTriangle(int32_t x1, int32_t y1,
                  int32_t x2, int32_t y2,
                  int32_t x3, int32_t y3,
                  uint32_t color)
Draws a solid filled triangle defined by three arbitrary vertices.
​
x1
int32_t
X coordinate of vertex 1.
​
y1
int32_t
Y coordinate of vertex 1.
​
x2
int32_t
X coordinate of vertex 2.
​
y2
int32_t
Y coordinate of vertex 2.
​
x3
int32_t
X coordinate of vertex 3.
​
y3
int32_t
Y coordinate of vertex 3.
​
color
uint32_t
Fill colour.
tft.fillTriangle(60, 10, 120, 110, 10, 110, TFT_YELLOW);

​
fillRectVGradient() — Vertical Gradient Rectangle

void fillRectVGradient(int16_t x, int16_t y, int16_t w, int16_t h,
                       uint32_t color1, uint32_t color2)
Fills a rectangle with a vertical colour gradient, blending linearly from color1 at the top to color2 at the bottom.
​
x
int16_t
X coordinate of the top-left corner.
​
y
int16_t
Y coordinate of the top-left corner.
​
w
int16_t
Rectangle width.
​
h
int16_t
Rectangle height.
​
color1
uint32_t
Gradient start colour (top edge).
​
color2
uint32_t
Gradient end colour (bottom edge).
// Blue at top, fading to black at bottom
tft.fillRectVGradient(0, 0, 240, 320, TFT_BLUE, TFT_BLACK);

​
fillRectHGradient() — Horizontal Gradient Rectangle

void fillRectHGradient(int16_t x, int16_t y, int16_t w, int16_t h,
                       uint32_t color1, uint32_t color2)
Fills a rectangle with a horizontal colour gradient, blending linearly from color1 at the left edge to color2 at the right edge.
​
x
int16_t
X coordinate of the top-left corner.
​
y
int16_t
Y coordinate of the top-left corner.
​
w
int16_t
Rectangle width.
​
h
int16_t
Rectangle height.
​
color1
uint32_t
Gradient start colour (left edge).
​
color2
uint32_t
Gradient end colour (right edge).
// Red to green horizontal gradient
tft.fillRectHGradient(10, 50, 200, 40, TFT_RED, TFT_GREEN);

// Combined gradient example
void setup() {
  tft.init();
  tft.setRotation(1);
  tft.fillScreen(TFT_BLACK);

  // Top half: vertical gradient (blue → black)
  tft.fillRectVGradient(0, 0, 320, 120, TFT_BLUE, TFT_BLACK);

  // Bottom half: horizontal gradient (red → yellow)
  tft.fillRectHGradient(0, 120, 320, 120, TFT_RED, TFT_YELLOW);
}

Build docs developers (and LLMs) love

Get started for freeTalk to us