WebToolsPlanet
Developer Tools

BBCode Editor

Write BBCode with a toolbar that wraps selected text in tags, and see a live preview of how it renders as HTML — all in one screen.

Last updated: May 26, 2026

Client-Side Processing
Input Data Stays on Device
Instant Local Execution
Something wrong with this tool? Report it

Find this tool useful? Support the project to keep it free!

Buy me a coffee

What is BBCode Editor?

BBCode (Bulletin Board Code) is the markup language used by forum software such as phpBB, vBulletin, and XenForo. Rather than typing HTML, users write tags like `[b]`, `[url]`, or `[quote]` which the forum engine converts to HTML when displaying posts.

This editor provides a formatting toolbar so you can apply BBCode tags without memorising the syntax. Select text in the textarea, then click a toolbar button to wrap the selection in the appropriate tags. The rendered preview on the right updates instantly so you can see exactly how your post will look before submitting it.

How to Use BBCode Editor

1

Type or paste BBCode into the left panel.

2

Select text and click a toolbar button (B, I, U, URL, etc.) to wrap the selection in BBCode tags.

3

Watch the rendered preview update live on the right.

4

Copy your finished BBCode and paste it into your forum post.

Common Use Cases

  • Composing forum posts with rich formatting before pasting to phpBB or vBulletin.
  • Teaching BBCode syntax with an immediate visual feedback loop.
  • Previewing how a long formatted post will look before submitting.
  • Drafting announcements or pinned threads with complex formatting.
  • Debugging broken BBCode by editing and watching the preview react.

Example Input and Output

A short BBCode snippet with bold, italic, and a list renders as formatted HTML in the preview.

BBCode
[b]Announcement[/b]

[i]Please read the following rules:[/i]

[list]
[*]Be respectful
[*]No spam
[/list]
Rendered preview
<strong>Announcement</strong><br><br><em>Please read the following rules:</em><br><br><ul><li>Be respectful</li><li>No spam</li></ul>

Privacy

All rendering happens locally in your browser. No text is sent to a server.

Nested tags

Most tags can be nested freely — for example [color=blue][b]blue bold text[/b][/color] works correctly.

Frequently Asked Questions

How do I apply formatting to existing text?

Select the text in the editor, then click the toolbar button. The button wraps your selection in the opening and closing BBCode tags automatically.

Which BBCode tags are supported?

[b], [i], [u], [s], [sub], [sup], [url], [img], [quote], [code], [pre], [list], [list=1], [color], [size], [center], [left], [right], and [hr].

Does the editor submit anything to a server?

No. Everything runs in your browser. Your text is never uploaded.

Can I use this to check BBCode before posting to a forum?

Yes — paste your BBCode into the editor and the right panel shows the rendered result so you can spot formatting errors before you submit.

Related Tools