IK

Web Playground

Edit the HTML, CSS and JavaScript below and press Run to see your web page come to life. Pick an example to get started, then make it your own.

Class 9 · Chapter 5 · Try this: Change the heading text to your own name, then add one more item to the list.
HTML

Editable code area for HTML. Press Tab to indent by two spaces. Press Escape to move focus out of the editor.

CSS

Editable code area for CSS. Press Tab to indent by two spaces. Press Escape to move focus out of the editor.

JS

Editable code area for JavaScript. Press Tab to indent by two spaces. Press Escape to move focus out of the editor.

Tip: press Ctrl + Enter to run. Your code runs in an isolated sandbox and is saved only in this browser.

About this playground

The three panels above are the three languages of the web working together. HTML provides the structure and content of the page. CSS controls how it looks — colours, spacing, fonts and layout. JavaScript adds behaviour, such as responding when a button is clicked. This mirrors the web development chapter of the Class 9 syllabus.

Anything you print with console.log() in your JavaScript appears in the Console tab, which is a key tool for understanding and debugging your programs. Your work is saved automatically in this browser, so you can come back to it later.

Ready to practise Python too? Head to the Python Playground, or read the full web development notes.