CodeDragon circular icon

CodeDragon might not work properly for you...

CodeDragon is designed to work with Google Chrome and Firefox, and a few features of CodeDragon have been found not to work properly with other web browsers. To make sure you get the best experience when using CodeDragon, please download the latest version of Google Chrome or Firefox and try again. You can install Google Chrome for free here, and Firefox here.

Or, you can continue anyway.

Learn

CodeDragon comes with an easy-to-follow tutorial and resources for teachers.

Learn Home

You can select from our continuously-expanding list of tutorials - they are designed to be taken from the start and followed until the end, and they are perfect for all levels of experience.

Tutorials

All CodeDragon tutorials in linear order, grouped by series. Just click one to play it!

Introduction

Tutorial illustration

Getting started

CodeDragon is amazing. This tutorial helps you get to grips with our Drag-n-Drop editor. If you've never used CodeDragon before, start here!

Written by Pal Kerecsenyi

Tutorial illustration

Hello, world!

Create a simple hello world website using the CodeDragon editor.

Written by Pal Kerecsenyi

Tutorial illustration

Using links

Without links, where would the web be? Use links to take your user to a different page or website.

Written by Pal Kerecsenyi

Tutorial illustration

Adding images

Images make your website look a lot cooler, and adding them is actually really easy.

Written by Pal Kerecsenyi

Tutorial illustration

Tables, lists, and summaries

A few neat tricks for organising data in HTML - they look cool, make your website appear neater, and are really easy to use.

Written by Pal Kerecsenyi

CSS

Tutorial illustration

Styling HTML with CSS

CSS is another coding language - it stands for Cascading Style Sheets and is the language for adding colours, fonts and other styles to your HTML website

Written by Pal Kerecsenyi