Components designed
for learning contents

A collection of semantic
visual components aimed to reduce
the learners’ cognitive load.

Components for Learning is an open project aiming to provide teachers and educators with a set of visual components that fit the complex needs of learning contents.

Such components are intended to be used in the HTML5 editor of your choice. Check the guide for a more detailed description of each component, examples, use cases and more!


Browse the components' guide to check all available components and its use examples.


Choose the component that better suits the pedagogycal needs for your learning content.


Once the plugin is installed, simply add and adapt your component of choice in the editor.

If you are a Moodle user, you can install it directly from the Moodle plugins directory and use the components straight in the Atto editor, no code required!

Get the plugin!

This project has been possible thanks to the Institut Obert de Catalunya , which has commited to this project and is currently using a very similar version of it. A big thank you to all the professors that accompanied me all over the design and testing process.

However, the project has just started and there is still a long road ahead. If you are a learning institution and you wish to team up in the making of new components and the improvement of the existing ones, please contact me!