> ## Documentation Index
> Fetch the complete documentation index at: https://launchpad-about-us.nxtwave.tech/llms.txt
> Use this file to discover all available pages before exploring further.

# 🕹️ Code Playground

> Use the Launchpad Code Playground to run HTML, CSS, JS, and SQL including PostgreSQL in the browser, with formatting and editorial-code shortcuts.

The Launchpad Code Playground lets you run Web and SQL code directly in your browser, no setup, no local install. This page covers what the Web and SQL playgrounds support and the editor features that make writing code faster, including one-click formatting, copying editorial code, and quick access to your last submitted code.

<Tabs>
  <Tab title="Web">
    Run **HTML, CSS, and JavaScript** together in the browser. Prototype a component, test a layout, or verify a JS snippet without leaving Launchpad.
  </Tab>

  <Tab title="SQL">
    Write and execute **SQL** queries, including **PostgreSQL**, right in the playground. Test joins, aggregations, and query patterns interactively.
  </Tab>
</Tabs>

## Editor features

The playground is powered by the same editor you use across coding practice on Launchpad, so the productivity shortcuts follow you everywhere.

### One-click code formatting

Format your code in one click, or use the keyboard shortcut to keep your hands on the keys. Consistent formatting makes review and debugging easier.

### Copy editorial code into the editor

When you view an editorial solution, copying its code into your editor auto-matches the language you are using. No more manual language switching before you can run the sample.

### Quick access to last submitted code

Your last submitted code is one click away. Come back a day later and pick up exactly where you left off.

<Info>
  The Code Playground is built for quick experiments. Pair it with your regular practice to try ideas before you commit to a full solution.
</Info>

## Where to go next

<CardGroup cols={2}>
  <Card title="Saved Snippets" icon="bookmark" href="/practice/saved-snippets">
    Store reusable code so your best templates are always a paste away.
  </Card>

  <Card title="Full Stack Track" icon="layer-group" href="/courses/full-stack">
    Move from playground experiments to building real frontend and backend projects.
  </Card>
</CardGroup>