Инструменты разработчика

HTML/CSS/JS Playground

Mini CodePen: three panels plus live sandboxed preview.

В браузере

PRO

HTML/CSS/JS Playground

Mini CodePen: three panels plus live sandboxed preview.

Pro открывает этот инструмент, повышенные лимиты и просмотр без рекламы при включённой рекламе.

Перейти на Pro Войти

Об этом инструменте

Experiment with HTML, CSS, and JavaScript side by side when you are teaching, debugging a snippet, or sketching a widget.

Code tools on 1CLIK are for short loops: format, preview, encode, copy. They are not a replacement for VS Code or a staging server. Use sample data, not production dumps with secrets.

When something fails to parse, the error is usually in the paste (smart quotes from Word, a truncated token, a missing brace). Fix the source, then run the tool again.

If you are building something that will go on 1CLIK itself, still test in the real theme — this playground does not load the production CSS of the hub.

Быстрые шаги

  1. Paste only the snippet you are comfortable exposing on your own machine.
  2. Run the preview.
  3. Copy the result into your editor.
  4. Clear the box when you are done with sensitive material.

Work stays in the browser unless you voluntarily save a draft on a tool that supports accounts.

Вопросы и ответы

Do you execute my JavaScript on a server?

No. Preview code runs in your browser.

Can I load npm packages?

No. This is a small preview, not a bundler.

RTL CSS?

You can paste RTL rules, then check them on a real page with dir=rtl.

Полезный следующий шаг

Правила сайта: Конфиденциальность · Условия