Summary  
This chapter explains how to use P5.js text functions (text(), textFont(), textSize()) along with transformations (e.g., rotate()) and randomness to algorithmically place, style, and layer typography for dynamic visual compositions.  

General domain of usage  
Generative art

PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04IiAvPgogICAgPHRpdGxlPkdlbmVyYXRpdmUgVHlwb2dyYXBoeSB3aXRoIFA1LmpzPC90aXRsZT4KICA8L2hlYWQ+CiAgPGJvZHk+CiAgICA8c2NyaXB0IHNyYz0iaHR0cHM6Ly9jZG4uanNkZWxpdnIubmV0L25wbS9wNUAxLjkuMC9saWIvcDUubWluLmpzIj48L3NjcmlwdD4KICAgIDxzY3JpcHQ+CiAgICAgIGxldCBmb250cyA9IFtdOwogICAgICBmdW5jdGlvbiBwcmVsb2FkKCkgewogICAgICAgIGZvbnRzWzBdID0gIkdlb3JnaWEiOwogICAgICAgIGZvbnRzWzFdID0gIkNvdXJpZXIgTmV3IjsKICAgICAgICBmb250c1syXSA9ICJBcmlhbCI7CiAgICAgIH0KCiAgICAgIGZ1bmN0aW9uIHNldHVwKCkgewogICAgICAgIGNyZWF0ZUNhbnZhcyg2MDAsIDQwMCk7CiAgICAgICAgYmFja2dyb3VuZCgyNDUpOwogICAgICAgIG5vTG9vcCgpOwogICAgICB9CgogICAgICBmdW5jdGlvbiBkcmF3KCkgewogICAgICAgIGJhY2tncm91bmQoMjQ1KTsKICAgICAgICBsZXQgd29yZHMgPSBbIkNyZWF0ZSIsICJ3aXRoIiwgIlR5cGUhIl07CiAgICAgICAgZm9yIChsZXQgaSA9IDA7IGkgPCAzMDsgaSsrKSB7CiAgICAgICAgICBsZXQgeCA9IHJhbmRvbSh3aWR0aCk7CiAgICAgICAgICBsZXQgeSA9IHJhbmRvbShoZWlnaHQpOwogICAgICAgICAgbGV0IHN6ID0gcmFuZG9tKDI0LCA2NCk7CiAgICAgICAgICBsZXQgcm90ID0gcmFuZG9tKC1QSSAvIDQsIFBJIC8gNCk7CiAgICAgICAgICBsZXQgZiA9IHJhbmRvbShmb250cyk7CiAgICAgICAgICBwdXNoKCk7CiAgICAgICAgICB0cmFuc2xhdGUoeCwgeSk7CiAgICAgICAgICByb3RhdGUocm90KTsKICAgICAgICAgIHRleHRGb250KGYpOwogICAgICAgICAgdGV4dFNpemUoc3opOwogICAgICAgICAgZmlsbChyYW5kb20oMTAwLCAyNTUpLCByYW5kb20oMTAwLCAyMDApLCByYW5kb20oMTUwLCAyNTUpLCAxODApOwogICAgICAgICAgdGV4dChyYW5kb20od29yZHMpLCAwLCAwKTsKICAgICAgICAgIHBvcCgpOwogICAgICAgIH0KICAgICAgfQogICAgPC9zY3JpcHQ+CiAgPC9ib2R5Pgo8L2h0bWw+

Typography is a powerful element in generative art, allowing you to blend language and form in expressive ways. In P5.js, you can use the `text()` function to display text on the canvas at any position. The `textFont()` function lets you select which font to use for your text, while `textSize()` controls the size. By combining these with transformations such as `rotate()`, and by varying position, color, or even the content, you can create dynamic, visually rich compositions where words and letters become integral parts of the artwork. Experimenting with different typefaces, adjusting their properties, and layering text elements can result in abstract visuals or reinforce a conceptual message. Generative typography often involves randomness or algorithmic placement, so each run produces a unique arrangement of text that blurs the line between language and visual design.

Which function in P5.js is used to display text on the canvas?

Explore the world of creative coding and generative art using P5.js. Learn to draw and animate shapes, apply transformations, incorporate user interaction, and design algorithmic visuals. Progress from basic sketches to advanced generative systems.

Build a foundational understanding of P5.js and its creative canvas environment. Learn how to draw shapes, apply colors, and prepare the tools needed for visual experimentation.

Explore how to rotate, scale, and move shapes, and learn to capture user input from the mouse and keyboard. Discover techniques for creating responsive sketches that adapt to screen size.

Learn how to animate drawings using the continuous draw loop. Experiment with randomness, noise, and motion to create dynamic generative visuals.

Dive into algorithmic approaches for producing complex visuals. Work with images, pixels, typography, and audio-driven effects to craft expressive generative artworks.

Apply creative coding techniques in guided projects. Build visually rich generative scenes and interactive installations that bring your artistic concepts to life.

Typography and Text as Art

Typography and Text as Art