Canvas Component Generator

PabloGGuizar
Community Explorer
1
660

Would you like to improve the look and feel of your Canvas course but don’t know where to start?

The Canvas Component Generator is a library of 15 customizable components you can use to take your first steps. From buttons to cards and accordions, this tool is ideal for creating a visually effective interface for your course.

This tool is a clear example of what can be achieved through vibe coding: it was generated with the help of Gemini, built with React, and published on GitHub.

This project is a spiritual successor to an earlier tool I developed years ago called The Button Maker:
https://community.canvaslms.com/t5/Canvas-LMS-Blog/The-Butt-n-Maker/ba-p/470330https://pablogguizar....

The Button Maker, which is no longer maintained, was built using HTML and CSS components from the Canvas LMS style guide (https://canvas.instructure.com/styleguide#). It allowed users to generate embeddable button HTML for the Rich Content Editor (RCE), with customizable color, size, and alignment.

Although that tool is now archived, it laid the foundation for the more powerful and flexible Canvas Component Generator.

Feel free to explore both tools and share your feedback!

1 Comment