Tables & Stat Blocks

Beginner · 5 min read · By Chitmunk Team · Updated Oct 18, 2026

Overview

Tables are a natural fit for card games. Stat blocks showing attack, defense, and health values. Score reference charts. Ingredient lists. Equipment grids. Chitmunk's table element lets you add structured data grids directly to your card designs, no need to fake it with carefully aligned text boxes and rectangles.

Tables resize and recolor like other Chitmunk elements, and their cells can pull from your spreadsheet, so each card in your deck can display different stats.

Adding a Table

To add a table to your card:

1. In the Add panel, under Basics, click Table ("Rows and columns of numbers").
2. A table with 4 rows, 3 columns, and a header row appears on the canvas.
3. Select the table and use the inspector on the right to configure its structure and appearance (Table structure, Table colors, and Cell text).

The table is added as a single element that you can move, resize, and rotate like any other element. Resizing the table automatically adjusts column widths and row heights proportionally.

Configuring Rows and Columns

In the properties panel, you can control the table's structure:

• Rows: Set the number of rows (1 to 50). All rows share equal height across the table.
• Columns: Set the number of columns (1 to 10). Columns are evenly spaced across the table's total width; there's no per-column width control.

To edit a cell's content, double-click the cell directly on the canvas, type, press Tab to move across and Enter to move down (Esc cancels). You can also edit every cell in the inspector's Cell text grid.

Header Row Styling

Most stat blocks and data tables benefit from a visually distinct header row. Chitmunk makes this easy:

• Toggle header row: In the inspector, check Header row. The first row is then styled differently from the data rows.
• Header background color: Set Header background to a distinct color for the header row, a darker shade of your card's color scheme works well.
• Header text color: Set Header color for header cells independently from data cells. White text on a dark header is a common choice.
• Header font weight: The header row always renders in bold; this isn't currently adjustable.

Cell Text and Your Spreadsheet

Table cells support the same {{Column Name}} template syntax as text elements. This means you can fill individual cells from your spreadsheet, and each card in your deck will display different stats.

For example, a stat block table might have:

• Header row: ATK | DEF | HP
• Data row: {{Attack}} | {{Defense}} | {{Health}}

When your spreadsheet has Attack, Defense, and Health columns, each card automatically shows that row's values in the table. Use the card navigator to preview different rows and verify the data is correct.

You can also mix static text and template variables in the same cell, for example, {{Attack}} dmg would display "5 dmg" if the Attack column contains 5.

Alternating Row Colors

Alternating row colors (sometimes called "zebra striping") make tables easier to read, especially on small cards where rows are close together. Chitmunk applies this automatically. There's no on/off toggle:

1. Select the table element.
2. In the Table colors section, set Cell background and Every other row. These two colors alternate automatically down the data rows.
3. A subtle contrast between the two is usually enough, for example, white and a very light gray. Set them to the same color to remove the striped look.

The header row (if enabled) uses its own color and is not affected by the alternating pattern. Alternation starts with the first data row after the header.

Font and Border Customization

Tables share some typography controls with text elements, though options are more limited:

• Font size: Set one base font size shared by header and data cells. Padding sets the inner spacing of each cell.
• Text color: Set the default text color for data cells; the header uses its own Header color field.

Cell text always renders left-aligned in the current build. There's no per-column alignment control, and font family is fixed at table creation rather than user-selectable.

For borders, the properties panel offers:

• Border color: The color of the lines between cells and around the table edge.
• Border thickness: The thickness of cell borders in pixels, applied uniformly to every cell. Set to 0 to remove all borders for a cleaner look.