비밀번호 생성기

What a Markdown table actually looks like

Markdown tables are plain text built from pipe characters (|) and dashes. A table has three parts: a header row, a separator row of dashes that defines the columns and their alignment, and any number of data rows. Hand-writing them is fiddly — one misplaced pipe and the table silently fails to render — so this generator gives you a spreadsheet-like grid to edit, and emits correct GitHub Flavored Markdown (GFM) for you. Here is the structure it produces:

• | Header 1 | Header 2 | — the column titles
• | :--- | ---: | — the separator that turns the first row into a header and sets alignment
• | cell | cell | — one line per data row

How alignment is encoded

The colons in the separator row are the entire alignment mechanism, and this tool writes them for you when you click the arrow in a column header. The mapping is exact:

Clicking the alignment button cycles left → center → right, and the live preview updates instantly so you can see the colons move.

A worked example

Suppose you build a two-column price list: headers Item and Price, with Price set to right alignment, and one row "Coffee / $3.50". The generator outputs:

• | Item | Price |
• | :--- | ---: |
• | Coffee | $3.50 |

On GitHub, in a README, or in any GFM renderer, that becomes a clean table with the price column flush right. The Copy HTML button instead gives you a full <table> with align attributes on each cell, for places that take HTML rather than Markdown.

The pipe-escaping detail that prevents broken tables

A literal | inside a cell would be read as a column separator and shatter the row. To prevent that, the generator escapes any pipe you type in a data cell to \| when it builds the Markdown — so a cell containing "yes | no" exports safely and renders as intended. This is one of the most common reasons hand-written tables break, and it's handled automatically here. (The separator row is exempt, since its dashes and colons are structural.)

Editing features that save time

• Inline editing. Click any cell and type; the Markdown preview regenerates on every keystroke.
• Tab navigation. Press Tab to jump to the next cell, wrapping to the next row at the end — fast for filling a grid by keyboard.
• Add or remove rows and columns. Buttons grow the table; the small × on each row and column header removes it (the table keeps at least one column and one data row).
• Import CSV or TSV. Paste comma- or tab-separated text and the tool detects the delimiter (tab wins if any tab is present), treats the first line as headers, strips surrounding quotes, and pads short rows so the grid stays rectangular.

Practical use cases

• README and documentation tables — feature comparisons, configuration options, API parameters.
• Pull request and issue descriptions — checklists and small data summaries that render natively on GitHub and GitLab.
• Converting spreadsheet snippets — paste a block from Excel or Google Sheets (which copies as TSV) straight into the importer.
• Static-site content — tables in Markdown posts for Jekyll, Hugo, MkDocs, and similar generators.

Common mistakes

• Omitting the separator row. Without the --- line, renderers don't treat the block as a table at all. This tool always includes it.
• Mismatched column counts. Every row must have the same number of cells; the importer pads ragged rows for you, but hand edits should keep counts equal.
• Forgetting that Markdown tables are not for layout. They're for tabular data; cells don't support block elements like lists or multiple paragraphs.
• Pasting CSV with commas inside quoted fields. The simple importer splits on the delimiter, so a value like "Smith, John" may split; clean such fields after import.

Everything stays on your device

The grid, the Markdown and HTML generation, the pipe-escaping, and the CSV import all run in your browser with plain JavaScript. Nothing you type or paste is uploaded, and copying uses your device's clipboard. The tool works offline once loaded.