A Rocket.Chat App that renders markdown tables beautifully - either as SVG images or ASCII art.
- Three rendering modes:
- Cards (SVG) - Beautiful graphical tables, perfect for mobile
- Unicode - Box-drawing characters (┌─┬─┐)
- ASCII - Classic style (+, -, |)
- Paste from Excel/Sheets - Tab-separated data is automatically converted to tables
- Clickable links - URLs in tables are extracted and shown as clickable links below
- /tableprefs command - Users can customize their own display preferences
- Multilingual - Help text in 11 languages (auto-detect or admin-configured)
- Parses GitHub Flavored Markdown (GFM) tables
- Supports column alignment (left, center, right)
- Handles emojis correctly
-
Download the latest release from Releases
-
Enable Apps in Rocket.Chat:
- Log in as administrator
- Go to Administration (gear icon) → Settings → General → Apps
- Set Enable the App Framework to
True - Set Enable development mode to
True(required for private apps) - Click Save changes
-
Install the App:
- Go to Administration → Apps → Private Apps
- Click Upload App
- Select the downloaded
.zipfile - Click Install
- When prompted, click Agree to accept permissions
-
Configure (optional):
- Go to Administration → Apps → Markdown Tables → Settings
- Choose table style: Cards (SVG), Unicode, or ASCII
- Configure link display and language preferences
# Clone the repository
git clone https://github.com/bamsejon/rocketchat-markdown-tables.git
cd rocketchat-markdown-tables
# Install dependencies
npm install
# Build the app
npm run build
# The zip file will be created in dist/Write standard markdown tables in your messages:
| Name | Age | City |
|---------|-----|-----------|
| Alice | 30 | Stockholm |
| Bob | 25 | Göteborg |Cards (SVG) - Clean graphical table, works great on mobile:
Unicode - Box-drawing characters:
┌─────────┬───────┬───────────┐
│ Name │ Age │ City │
├─────────┼───────┼───────────┤
│ Alice │ 30 │ Stockholm │
│ Bob │ 25 │ Göteborg │
└─────────┴───────┴───────────┘
ASCII - Classic style:
+---------+-------+-----------+
| Name | Age | City |
+---------+-------+-----------+
| Alice | 30 | Stockholm |
| Bob | 25 | Göteborg |
+---------+-------+-----------+
Copy cells from Excel, Google Sheets, or any spreadsheet and paste directly into Rocket.Chat. Tab-separated data is automatically converted!
URLs in table cells are automatically extracted and displayed as clickable links below the table. Use /tableprefs links off to disable this.
Users can customize their own table display style, overriding the admin default:
/tableprefs style unicode - Box-drawing characters (┌─┬─┐)
/tableprefs style ascii - Classic style (+, -, |)
/tableprefs style cards - SVG image (mobile-friendly)
/tableprefs style default - Use admin default setting
/tableprefs links on - Show links below tables
/tableprefs links off - Hide links below tables
Run /tableprefs without arguments to see your current settings.
The app supports standard GFM alignment syntax:
| Left-aligned | Center-aligned | Right-aligned |
|:-------------|:--------------:|--------------:|
| Left | Center | Right |Go to Administration → Apps → Markdown Tables → Settings
| Setting | Description |
|---|---|
| Table Style | Cards (SVG), Unicode, or ASCII |
| Show links below table | Extract and display clickable links |
| Disable link previews | Prevent automatic URL previews |
| Default show links | Default setting for new users |
| Help text language | Auto-detect or select specific language |
- Rocket.Chat 6.0 or newer
- Apps Framework enabled
- Administrator access for installation
- Make sure Enable development mode is set to
Truein Settings → General → Apps - Try refreshing the page after enabling
- Check that the app is enabled in Administration → Apps → Private Apps
- Verify the app status shows "Enabled"
- Make sure your table has the separator row (e.g.,
|---|---|)
- Ensure you're using Cards mode in app settings
- Some older Rocket.Chat versions may not support data URL images
- User style override - Users can now choose their own table style via
/tableprefs style ascii/unicode/cards - Admin setting becomes the default, individual users can override with their preference
- Run
/tableprefs style defaultto go back to using the admin setting
- Fixed large table rendering - Tables with 3+ columns now render correctly
- Compressed SVG output - Uses CSS classes and shorter attributes to reduce base64 URL length
- Rocket.Chat compatibility - Fixes issue where long data URLs broke markdown parsing
- Reverted nested markdown approach - Rocket.Chat doesn't support
[](link)syntax
- Fixed click behavior - Tables now link to
#when clicked, preventing the data URL popup - Reverted attachment approach - Back to inline images for better rendering in desktop clients
- Non-clickable tables - SVG tables rendered as attachments (reverted in v1.13.0 due to rendering issues in desktop client)
- Column alignment in SVG - Left, center, and right alignment now works in Cards mode
- Fixed anchor links - Links like
[Link](#)no longer cause rendering issues
- Bold/italic/code support - Formatted text now renders correctly in SVG tables
- Text with
**bold**,*italic*, or`code`displays with proper styling
- Fixed SVG rendering when tables contain links
- Improved URL deduplication
- Links displayed before table image for proper rendering
- Cards mode - SVG table rendering
- Clickable links - URLs extracted and shown below tables
- /tableprefs command - User preferences
- Multilingual help text - 11 languages supported
- Extract and display clickable links below tables
- Support both markdown links and plain URLs
- Add setting to toggle link display
MIT
bamsejon - https://github.com/bamsejon