# Welcome to the Playground!
I see that it's your first time here. Please consider doing a few lessons first if you are not familiar with Codemoji and in no time you'll be able to come back and master the playground!
This area is called the playground. You can use it to play around with the different tags, building whatever webpage you would like. There are no rules! Simply drag the emojis from the Emoji Box into the text editor on the left and then add text to see what you can create.
As always, press the blue "Run Code" button in the bottom left corner of the screen to run your code, then press the purple "View Code" button that appears to see what you've created!
If you forget your task (to play!) or would like a refresher as to how the playground works, simply click the white triangle in the bottom left corner of the screen and this tip will reappear.
## Code Example
### index.html
```html
Your Title Here
Your Main Heading
Your introductory paragraph goes here.
A Subtitle
More content below.
```
### style.css
```css
.color-1 { color: red; }
.color-2 { color: blue; }
.size-1 { font-size: 12px; }
.size-2 { font-size: 22px; }
```
## HTML Tags Overview
- ``: This is the main tag that indicates the start and end of an HTML document.
- ``: Contains meta-information about the document, such as the title.
- ``: Sets the title for the document displayed in the browser tab.
- `<body>`: Contains the content of the HTML document that will be displayed on the page.
- `<h1>`, `<h2>`...`<h6>`: Define headings, with `<h1>` as the most important.
- `<p>`: Defines a paragraph.
- `<div>`: A generic container for content.
- `<ul>`/`<li>`: Creates an unordered list.
- `<strong>`: Indicates strong importance.
- `<em>`: Highlights emphasized text.
### Emojis Gallery
1. Smiley Emojis
-
-
- ...
This is just a brief overview and placeholder texts, so feel free to replace them with your own content to create dynamic web pages!