# TRMNL

> ePaper display platform with customizable content. Build custom layouts for TRMNL devices using the Framework UI.

TRMNL is a platform for building and displaying content on ePaper screens. The Framework UI provides HTML/CSS utilities, layout primitives, and components purpose-built for 1-bit and 2-bit ePaper rendering.

## Guides

- [V3 Overview](https://trmnl.com/framework/docs/3.1/v3_overview.md): Framework v3 introduces a complete color system for ePaper devices. The framework now supports chromatic palettes, semantic color roles, and an extended grayscale scale, while shifting its internal architecture to CSS custom properties for cleaner, smaller stylesheets. Existing markup continues to work without changes.
- [V3 Upgrade Guide](https://trmnl.com/framework/docs/3.1/v3_upgrade_guide.md): Framework v3 is structurally backward-compatible with v2: your existing class names still compile and render. However, the `1bit` grayscale dither patterns have been rebuilt on a new linear scale, so most shade names now produce different lightness values than they did in v2. Review the migration table below to restore your original look or take advantage of the finer 14-step palette.
- [V3 Enhancement Guide](https://trmnl.com/framework/docs/3.1/v3_enhancement_guide.md): Framework v3 opens up the full color spectrum for ePaper plugins. This guide walks through the key enhancements you can adopt, from chromatic backgrounds and text to semantic labels and the extended grayscale.
- [TRMNL X Guide](https://trmnl.com/framework/docs/3.1/trmnl_x_guide.md): TRMNL X is a larger, 4-bit ePaper display. This guide covers everything that changed in the Framework to support it. Your existing plugins will continue to work, but by adopting these new features you can build layouts that take full advantage of the larger screen, portrait orientation, and expanded grayscale.

## Arrangement

- [Size](https://trmnl.com/framework/docs/3.1/size.md): The Size system provides utility classes for controlling width and height dimensions. It includes both fixed sizes and responsive utilities to handle various layout needs.
- [Spacing](https://trmnl.com/framework/docs/3.1/spacing.md): The Spacing system provides utility classes for controlling margins and padding. It includes both fixed sizes and decimal values to handle precise spacing needs.
- [Gap](https://trmnl.com/framework/docs/3.1/gap.md): The Gap system provides consistent spacing between elements using CSS gap property. It offers predefined sizes, responsive spacing, and custom values to maintain visual rhythm throughout your interface.
- [Flex](https://trmnl.com/framework/docs/3.1/flex.md): The Flex system provides utility classes for creating flexible layouts using Flexbox. It supports both row and column directions with various alignment, centering, and stretching options.
- [Grid](https://trmnl.com/framework/docs/3.1/grid.md): The Grid system provides a flexible way to create both column-based and row-based layouts. It supports various column counts, column spans, and responsive behaviors to create complex layouts easily.
- [Aspect Ratio](https://trmnl.com/framework/docs/3.1/aspect_ratio.md): The Aspect Ratio utility uses the native CSS aspect-ratio property to maintain consistent proportions for elements. Perfect for images, videos, and containers that need to maintain specific width-to-height ratios across different screen sizes.

## Responsive Utilities

- [Responsive](https://trmnl.com/framework/docs/3.1/responsive.md): The Responsive system provides two complementary approaches for creating adaptive layouts: **Size-based** breakpoints that respond to screen dimensions, and **Bit-depth** variants that adapt to color capabilities. Together, they enable precise control over how your content appears across TRMNL's diverse range of devices.
- [Responsive Test](https://trmnl.com/framework/docs/3.1/responsive_test.md): This page tests responsive utilities by comparing SCSS mixins with CSS classes across different screen conditions. Each test row shows an element styled with SCSS mixins alongside the same element styled with CSS utility classes. Both columns should look identical when the conditions are met, demonstrating that mixins and classes produce equivalent results.
- [Visibility](https://trmnl.com/framework/docs/3.1/visibility.md): The visibility and display utilities provide comprehensive control over element visibility and display types across devices. They include hidden/visible controls and display helpers like flex, grid, and inline, with responsive and bit-depth variants for device-specific layouts.

## Styling

- [Background](https://trmnl.com/framework/docs/3.1/background.md): Use the color palette defined in [Colors](/framework/docs/3.1/colors). Apply these shades with bg--{token} for backgrounds. On 1-bit displays, grayscale uses dither patterns; on 2-bit and 4-bit+, solid colors render.
- [Border](https://trmnl.com/framework/docs/3.1/border.md): The Border system creates the illusion of grayscale borders through carefully designed dither patterns. When rendered on 1-bit displays, these patterns create varying border intensities using alternating black and white pixels.
- [Rounded](https://trmnl.com/framework/docs/3.1/rounded.md): The Rounded system provides consistent border radius values for creating smooth corners on elements. It offers predefined sizes, corner-specific controls, and custom values to maintain visual consistency throughout your interface.
- [Outline](https://trmnl.com/framework/docs/3.1/outline.md): The Outline utility provides pixel-perfect rounded borders using CSS border-image with a 9-slice composite image. On 1-bit displays, it renders crisp, dithered corner patterns that scale with the element. On 2-bit and 4-bit displays, it falls back to standard CSS borders with border-radius.
- [Image](https://trmnl.com/framework/docs/3.1/image.md): Image creates the illusion of grayscale through carefully designed dither patterns. When rendered on 1-bit (black and white only) displays, these patterns create an illusion of different shades of gray by using specific arrangements of black and white pixels.
- [Image Stroke](https://trmnl.com/framework/docs/3.1/image_stroke.md): The Image Stroke system allows you to add an outline to a vector or transparent raster images with customizable stroke width and color. This is useful for creating images that stand out against shaded backgrounds.
- [Scale](https://trmnl.com/framework/docs/3.1/scale.md): The Scale system provides utility classes to scale the entire interface by adjusting the UI scale factor. This is useful for adapting content density for different viewing distances or user preferences.
- [Colors](https://trmnl.com/framework/docs/3.1/colors.md): The Colors system defines the complete palette for the framework: grayscale, chromatic hues, blend pairs, and semantic roles (primary, success, error, warning). Use these tokens with bg--, text--, and other utilities. See Background and Text Color for usage examples.
- [Tokens](https://trmnl.com/framework/docs/3.1/tokens.md): The Tokens reference lists every Framework CSS variable from `_variables_root.scss` and display overrides in `_variables_overrides.scss`. Use it to understand defaults, 2-bit visual/layout behavior, high-density typography, and 4/8/16-bit scaling.

## Typography

- [Font Family](https://trmnl.com/framework/docs/3.1/font_family.md): The Framework ships two pixel font bundles: Classic (NicoPups, NicoClean, BlockKie) and TRMNL (TRMNL12, TRMNL16, TRMNL21). Low-density displays use the selected bundle; high-density displays use Inter Variable for legibility.
- [Font Weight](https://trmnl.com/framework/docs/3.1/font_weight.md): Utility classes for controlling font weight independently of size. Classic ships in a single weight, so <code>font--bold</code> is a no-op on low-density Classic; on low-density TRMNL it picks the bundled bold variant; on high-density displays it sets the Inter Variable weight.
- [Font Glyphs](https://trmnl.com/framework/docs/3.1/font_glyphs.md): Browse every glyph available in each Framework font. Switch between the Classic and TRMNL bundles to view their full character inventory.
- [Text Size](https://trmnl.com/framework/docs/3.1/text_size.md): Utility classes for controlling text size. Each class sets the correct font family, size, line-height, and smoothing for the active density tier: pixel bundle on low-density displays, Inter Variable on high-density displays.
- [Text Alignment](https://trmnl.com/framework/docs/3.1/text_alignment.md): The Text Alignment system provides utility classes for controlling horizontal text alignment. Use left, center, right, and justify alignment with responsive variants for breakpoints, orientation, and bit-depth.
- [Text Color](https://trmnl.com/framework/docs/3.1/text_color.md): The Text Color system creates the illusion of grayscale text through carefully designed dither patterns. When rendered on 1-bit (black and white only) displays, these patterns create an illusion of different shades of gray by using specific arrangements of black and white pixels. The shade scale matches the [Colors](/framework/docs/3.1/colors) palette.
- [Text Stroke](https://trmnl.com/framework/docs/3.1/text_stroke.md): The Text Stroke system allows you to add outlined text with customizable stroke width and color. This is useful for creating text that stands out against shaded backgrounds.

## Modulations

- [Overflow](https://trmnl.com/framework/docs/3.1/overflow.md): The Overflow engine automatically lays out items into up to N columns and adds an “and X more” label when content exceeds the available height. It also applies text clamping per-column width and handles grouped headers without leaving orphaned headings.
- [Table Overflow](https://trmnl.com/framework/docs/3.1/table_overflow.md): When a table has more rows than can fit within the available vertical space, it constrains its height and appends a trailing “and X more” row to indicate the hidden entries.
- [Clamp](https://trmnl.com/framework/docs/3.1/clamp.md): The Clamp engine truncates text to a specified number of lines using word-based ellipsis. It preserves the original text, measures available width, and re-applies clamping whenever layouts change.
- [Format Value](https://trmnl.com/framework/docs/3.1/format_value.md): The Value Formatting system automatically formats numeric values to fit within their containers while maintaining readability. It supports various formatting options including abbreviations (K, M, B), dynamic precision adjustment, and currency values with proper symbol placement.
- [Fit Value](https://trmnl.com/framework/docs/3.1/fit_value.md): The Text Fitting system automatically adjusts the font size, weight, and line height of text elements so that they fit within their containers. This dynamic resizing is especially useful for responsive layouts where available space may vary, ensuring that content is always legible.
- [Content Limiter](https://trmnl.com/framework/docs/3.1/content_limiter.md): The Content Limiter system automatically restricts the height of content areas based on the view type. When content exceeds the height threshold, it applies smaller typography and truncates overflowing text using the Clamp Engine to fit the available space.
- [Pixel Perfect](https://trmnl.com/framework/docs/3.1/pixel_perfect.md): The Pixel Perfect system ensures text renders with crisp edges by aligning text precisely to the pixel grid. We use specialized pixel fonts designed to work at specific pixel sizes, producing the sharpest possible rendering and preventing sub-pixel rendering issues that cause text to appear blurry or inconsistently bold in final renders when converting layouts to a 1-bit color space for ePaper displays.
- [Framework Runtime](https://trmnl.com/framework/docs/3.1/framework_runtime.md): Different devices have different, fixed amounts of screen space. The Framework Runtime fills that space the best way it can when a plugin layout renders. It follows a few simple rules and does the heavy, repetitive calculations for you, so the result is clean and reliable every time. You can inspect it from the “Framework Runtime” panel in the top navigation.

## Foundation

- [Structure](https://trmnl.com/framework/docs/3.1/structure.md): The framework structure is a fixed hierarchy that defines the display environment. Screen, View, Layout, Title Bar, Columns, and Mashup each have a specific role. Plugins render their content inside Views. Follow the exact div setup; deviating causes layout and rendering issues.
- [Screen](https://trmnl.com/framework/docs/3.1/screen.md): The Screen component is the outermost container that defines the device dimensions and provides global settings for your content.
- [View](https://trmnl.com/framework/docs/3.1/view.md): A View holds content (e.g. a plugin instance). Single views use `view--full` inside the Screen; multiple views go inside a Mashup. The view modifier sets each view's share of space; the Mashup modifier controls the arrangement. View and Layout receive calculated dimensions from the device and orientation.
- [Layout](https://trmnl.com/framework/docs/3.1/layout.md): The Layout is the content container inside a View. There should be exactly one `layout` per `view`. Its height is calculated automatically based on the device type, orientation, and whether a title bar is present. It can arrange content horizontally (`layout--row`) or vertically (`layout--col`), with alignment and stretch modifiers. For organizing content inside it, use `flex`, `columns`, or `grid`.
- [Title Bar](https://trmnl.com/framework/docs/3.1/title_bar.md): The Title Bar component provides a consistent header for terminal-like interfaces, displaying application information such as icons, titles, and instance details.
- [Columns](https://trmnl.com/framework/docs/3.1/columns.md): The Columns system handles lots of same-type data. You provide the items; it distributes them into columns and manages overflow, so you can display as few or as many items as there are in any given situation. For other layout needs, use Grid or Flex.
- [Mashup](https://trmnl.com/framework/docs/3.1/mashup.md): A Mashup arranges multiple plugin views within a single screen. The mashup modifier (e.g. `mashup--1Lx1R`, `mashup--2x2`) controls how the views are positioned, while each view's own modifier determines how much space it occupies.

## Elements

- [Title](https://trmnl.com/framework/docs/3.1/title.md): The Title system provides consistent text headings with different size variants. It helps maintain visual hierarchy and readability throughout the interface.
- [Value](https://trmnl.com/framework/docs/3.1/value.md): The Value system provides consistent text styling for displaying numerical and textual values, with various size options and support for tabular numbers. It ensures readability and visual hierarchy across different contexts.
- [Label](https://trmnl.com/framework/docs/3.1/label.md): The Label system provides various styles for displaying text labels, with options for different visual treatments and sizes. The filled variant uses black (darkest) background; label--primary, label--success, etc. use semantic colors. Labels can be used to highlight text, show status, or create visual hierarchy in your interface.
- [Description](https://trmnl.com/framework/docs/3.1/description.md): The Description component provides a standardized way to display descriptive text content with consistent styling.
- [Divider](https://trmnl.com/framework/docs/3.1/divider.md): The Divider element provides a simple, standalone way to create visual separations in your layouts. Dividers automatically adapt to their background color for optimal visibility across four background types: white, light, dark, and black.

## Components

- [Rich Text](https://trmnl.com/framework/docs/3.1/rich_text.md): The Rich Text component provides a flexible container for displaying text content with consistent styling and layout options. It's commonly used for paragraphs, articles, and other formatted text content that needs to maintain readability and visual hierarchy.
- [Item](https://trmnl.com/framework/docs/3.1/item.md): The Item component provides a flexible container for displaying content with optional metadata and indexing. It's commonly used for lists, schedules, and other content that needs consistent formatting.
- [Table](https://trmnl.com/framework/docs/3.1/table.md): The Table system provides structured data presentation with consistent styling and various size options. It's designed to display information in a clear, scannable format while maintaining visual hierarchy.
- [Chart](https://trmnl.com/framework/docs/3.1/chart.md): With careful, minimal styling choices, TRMNL can display a variety of numerical or time centric content as charts and graphs.
- [Progress](https://trmnl.com/framework/docs/3.1/progress.md): The Progress component provides visual indicators for completion status and step-based processes. Optimized for ePaper displays with bitmap patterns for 1-bit displays and solid colors for 4-bit+ displays.

## Help Articles

- [Alias Plugin](https://help.trmnl.com/en/articles/10701448-alias-plugin): Fetch encrypted content from any origin.
- [Is there a plugin for...](https://help.trmnl.com/en/articles/12814732-is-there-a-plugin-for): Looking for a specific plugin? Here's every public plugin and community recipe we have.
- [Device / WiFi troubleshooting](https://help.trmnl.com/en/articles/10193157-device-wifi-troubleshooting): Understanding error screens and connection issues.
- [International Customs / Duty Fees](https://help.trmnl.com/en/articles/10498361-international-customs-duty-fees): Pricing impact when buying TRMNL from abroad.
- [Serverless](https://help.trmnl.com/en/articles/14130649-serverless): Build custom plugins in any language with a free VM.
- [Connect your Device to Terminus (BYOS)](https://help.trmnl.com/en/articles/12263392-connect-your-device-to-terminus-byos): How to point your TRMNL to a self hosted BYOS solution.
- [Replacement parts](https://help.trmnl.com/en/articles/11565162-replacement-parts): Hardware options to repair or modify your TRMNL.
- [Portrait mode](https://help.trmnl.com/en/articles/11396258-portrait-mode): When you like your rotation and orientation to be taller, not wider, portrait mode can be enabled for many devices, including BYOD.
- [How to set up a new device](https://help.trmnl.com/en/articles/9416306-how-to-set-up-a-new-device): Unboxing and connecting TRMNL for the first time.
- [Enable WiFi Pairing Mode](https://help.trmnl.com/en/articles/11511577-enable-wifi-pairing-mode): Add or change your local network settings.
- [Put your TRMNL in "flashing mode"](https://help.trmnl.com/en/articles/11936721-put-your-trmnl-in-flashing-mode): Recover a device with malfunctioning firmware.
- [Troubleshooting an Unresponsive Device](https://help.trmnl.com/en/articles/12407673-troubleshooting-an-unresponsive-device): If your device seems stuck, bricked, dead, frozen, displays double-images or ghosting, or is otherwise generally not responding or not working, this troubleshooting guide may help.
- [Creating Inline Images for Plugins](https://help.trmnl.com/en/articles/12391781-creating-inline-images-for-plugins): You can reduce a network dependency and point of failure on your plugin by replacing network requests for SVG icons in the Title Bar with inline SVG code using a few online tools and Liquid markup.
- [Visual Editor (IDE)](https://help.trmnl.com/en/articles/14726819-visual-editor-ide): A fully featured web UI for plugin development.
- [Webhook Image](https://help.trmnl.com/en/articles/13213669-webhook-image): Push custom images to your TRMNL display from any script, service, or automation.
- [TRMNL Companion for iOS](https://help.trmnl.com/en/articles/12294875-trmnl-companion-for-ios): Sync data from Apple like Calendars, Health, Reminders, Shortcuts, and Home.
- [How to unpair / re-pair a device](https://help.trmnl.com/en/articles/11546838-how-to-unpair-re-pair-a-device): Unlink your TRMNL to give to someone else.
- [Turning Off the TRMNL X](https://help.trmnl.com/en/articles/14553723-turning-off-the-trmnl-x): Whether you are going away for an extended period or are shipping it, the TRMNL X can be turned off to conserve battery.
- [Device battery FAQ](https://help.trmnl.com/en/articles/10556850-device-battery-faq): On charging and predicting your TRMNL's energy.
- [TRMNL X in Portrait Mode Shows Landscape Screen](https://help.trmnl.com/en/articles/14501849-trmnl-x-in-portrait-mode-shows-landscape-screen): The TRMNL X was, prior to April 9, 2026, showing portrait on a paricular plugin or recipe, but suddenly started showing the landscape screen. Alternatively, some plugins show landscape, others show portrait.
- [Why is BYOD needed for Kindle?](https://help.trmnl.com/en/articles/11672796-why-is-byod-needed-for-kindle): Understanding how device mirroring works for non-native devices.
- [Device Models](https://help.trmnl.com/en/articles/11547008-device-models): Understanding the device switcher dropdown for BYOD / DIY devices.
- [Keeping your TRMNL plugged in](https://help.trmnl.com/en/articles/11186878-keeping-your-trmnl-plugged-in): Tips to preserve the life of your device.
- [Custom plugin filters](https://help.trmnl.com/en/articles/10347358-custom-plugin-filters): Improve content formatting with Liquid and localizations.
- [How to Change Screens](https://help.trmnl.com/en/articles/12410440-how-to-change-screens): Don't want to wait to refresh? You can manually switch the display to the next screen on your playlist with the push of a button.
- [Testing your Alias or Redirect plugin](https://help.trmnl.com/en/articles/11628971-testing-your-alias-or-redirect-plugin): How to quickly check on proxied graphics and JSON.
- [How to Assemble your TRMNL](https://help.trmnl.com/en/articles/10003236-how-to-assemble-your-trmnl): Closing up your device safely.
- [How to Preload WiFi Credentials](https://help.trmnl.com/en/articles/12513240-how-to-preload-wifi-credentials): If you want to preset wireless SSID and Password for a recipient you are gifting the TRMNL to and need it to "just work" when they turn it on, your TRMNL can be set with and store multiple WiFi network credentials.
- [TRMNL X Not Broadcasting TRMNL Network](https://help.trmnl.com/en/articles/14170056-trmnl-x-not-broadcasting-trmnl-network): You unboxed your new TRMNL X and it's showing firmware 1.7.5 and stating to connect to "TRMNL-XXXX" network to complete setup, but it's not broadcasting.
- [Nano Banana Dashboard](https://help.trmnl.com/en/articles/13692805-nano-banana-dashboard): Transform your plugin data to scenic dashboards
- [Home Assistant Screenshot](https://help.trmnl.com/en/articles/13281388-home-assistant-screenshot): Display your smart home dashboards on TRMNL e-ink displays
- [Display Calibration for BYOD Devices](https://help.trmnl.com/en/articles/13171449-display-calibration-for-byod-devices): Tweaking the render output on your custom display.
- [Gaffa](https://help.trmnl.com/en/articles/12766127-gaffa): News from any site extracted and summarized for your TRMNL.
- [PurpleAir](https://help.trmnl.com/en/articles/12147860-purpleair): Display sensor data from the PurpleAir Ecosystem
- [AI Agent](https://help.trmnl.com/en/articles/14130438-ai-agent): Build custom plugins without writing any code.
- [Plugin recipes](https://help.trmnl.com/en/articles/10122094-plugin-recipes): Sharing private plugins for other users to install.
- [User level API Keys](https://help.trmnl.com/en/articles/11195228-user-level-api-keys): Features and tools that require this token.
- [Custom plugin form builder](https://help.trmnl.com/en/articles/10513740-custom-plugin-form-builder): Create user-facing configuration fields with YAML.
- [Stock Price](https://help.trmnl.com/en/articles/10031211-stock-price): Public securities valuation by ticker
- [API Catalog](https://help.trmnl.com/en/articles/14136603-api-catalog): Endpoints to accelerate custom plugin development.
- [Plugin Markup Version Control](https://help.trmnl.com/en/articles/14136474-plugin-markup-version-control): Simple undo / redo functionality for your plugin layouts.
- [UI Framework versioning](https://help.trmnl.com/en/articles/14135346-ui-framework-versioning): Pick the right Framework dependency for your plugins
- [Grayscale: 1-bit, 2-bit, 4-bit in Framework](https://help.trmnl.com/en/articles/12386214-grayscale-1-bit-2-bit-4-bit-in-framework): The plugin design Framework supports 16 levels of greyscale, with and without dithering depending on hardware/firmware capabilities and plugin settings. 1bit, 2bit, 4bit.
- [Sleep Mode](https://help.trmnl.com/en/articles/11129379-sleep-mode): Understanding what, why, and how a TRMNL goes to sleep.
- [Private Plugins](https://help.trmnl.com/en/articles/9510536-private-plugins): Build a custom plugin with our simple WYSIWYG editor.
- [Dynamic Polling URLs](https://help.trmnl.com/en/articles/12689499-dynamic-polling-urls): Customize and generate API endpoints on the fly.
- [Dropbox Photo Album](https://help.trmnl.com/en/articles/13933176-dropbox-photo-album): Stream photos from a private folder.
- [What is fast refresh?](https://help.trmnl.com/en/articles/12512481-what-is-fast-refresh): What is fast refresh, and how it effects the way the screen flashes or flickers when changing content.
- [Playlist Scheduler](https://help.trmnl.com/en/articles/11663305-playlist-scheduler): Dictate what you want to see, and when, on your TRMNL devices.
- [Compare custom plugin types](https://help.trmnl.com/en/articles/10546870-compare-custom-plugin-types): There are several ways to build a plugin - which is right for your application?
- [Device Static IPs](https://help.trmnl.com/en/articles/13673576-device-static-ips): Increase security and accessibility on your local network.
- [Setting up TRMNL on tricky Wi-Fi situations](https://help.trmnl.com/en/articles/11663377-setting-up-trmnl-on-tricky-wi-fi-situations): Get your device running on captive-portal, WPA/WPA-2 Enterprise, and (many) corporate Wi-Fi environments.
- [WPA2 Enterprise WiFi](https://help.trmnl.com/en/articles/13722338-wpa2-enterprise-wifi): Connect to secure WiFi networks at work or your basement bunker.
- [Connect your Xteink X4 to TRMNL](https://help.trmnl.com/en/articles/13563787-connect-your-xteink-x4-to-trmnl):
- [Special Functions](https://help.trmnl.com/en/articles/9672080-special-functions): How to set up custom behaviors on your device.
- [Google Calendar](https://help.trmnl.com/en/articles/9483539-google-calendar): View your upcoming schedule and appointments.
- [Advanced Liquid](https://help.trmnl.com/en/articles/10693981-advanced-liquid): Pro tips for TRMNL plugin templating.
- [Custom plugins with Apple Shortcuts](https://help.trmnl.com/en/articles/10108737-custom-plugins-with-apple-shortcuts): Build TRMNL plugins directly from your Apple device.
- [Account Deletion](https://help.trmnl.com/en/articles/13639812-account-deletion): How to remove your data from TRMNL.
- [TRMNL for iPad](https://help.trmnl.com/en/articles/11647459-trmnl-for-ipad): Convert your Apple tablet into a TRMNL device.
- [Skipping Screens within Plugin Markup](https://help.trmnl.com/en/articles/13615138-skipping-screens-within-plugin-markup): The special TRMNL_SKIP_SCREEN_GENERATION and TRMNL_SKIP_DISPLAY variables allow the plugin to be in control on whether it will be updated or seen.
- [TRMNL Mounting Options](https://help.trmnl.com/en/articles/12410189-trmnl-mounting-options): Our community of creators has designed multiple 3d printable mounts for attaching a TRMNL to fridges, IKEA organizers, servers, and more. This also includes frames and other aesthetic designs.
- [Demo Data for Publishing Plugins](https://help.trmnl.com/en/articles/12772238-demo-data-for-publishing-plugins): When you are ready to take your private plugin and turn it into a public recipe, so others can benefit from your work, it's important to make sure you don't leak personal information in the recipe master.
- [How to Enable 2-bit on TRMNL (OG)](#): With the release of fast refresh and 2-bit support in August 2025 to the TRMNL (OG) panel, learn how to preview this feature with specific plugins and how to enable it for your device or plugins.
- [Mashups](https://help.trmnl.com/en/articles/10168132-mashups): How to build split-screen plugins.
- [Create a Custom Sleep Screen](https://help.trmnl.com/en/articles/12387950-create-a-custom-sleep-screen): Using playlist scheduling, the important flag, and the plugin of your choice, you can set a custom sleep screen so that your device saves energy while displaying whatever you wish while in sleep mode.
- [Image Display](https://help.trmnl.com/en/articles/11479051-image-display): Serve graphics you already control.
- [How to change my time zone](https://help.trmnl.com/en/articles/10575123-how-to-change-my-time-zone): Set a time zone from your user profile.
- [Weather icons](https://help.trmnl.com/en/articles/11823386-weather-icons): Access our hosted icon pack for your own plugins.
- [DNS and Network Requests for Firewall Whitelists](https://help.trmnl.com/en/articles/12386067-dns-and-network-requests-for-firewall-whitelists): If there is a corporate firewall or even a private DNS filter on your network, like Pi-Hole, learn what domains should be whitelisted for TRMNL devices to retrieve new screens.
- [Polymarket](https://help.trmnl.com/en/articles/9643261-polymarket): Popular predictions, ending soon.
- [How to Disassemble your TRMNL](https://help.trmnl.com/en/articles/10003228-how-to-disassemble-your-trmnl): Opening up your device safely.
- [Finding your TRMNL Serial](https://help.trmnl.com/en/articles/11510216-finding-your-trmnl-serial): For debugging and customer support.
- [Screensaver](https://help.trmnl.com/en/articles/10302141-screensaver): Peaceful graphics to keep you in flow.
- [TRMNL mobile app](https://help.trmnl.com/en/articles/10041383-trmnl-mobile-app): How to use TRMNL on your iPhone or Android. Sort of.
- [Reset 2FA](https://help.trmnl.com/en/articles/11735136-reset-2fa): Disabling multi factor authentication on your TRMNL account.
- [Missing Data in Multiple Polling URLs](https://help.trmnl.com/en/articles/12385769-missing-data-in-multiple-polling-urls): Plugins can collect data via the polling strategy, and can include multiple URLs in a single plugin by separating each URL by a line break.
- [How to cancel an order](https://help.trmnl.com/en/articles/12026411-how-to-cancel-an-order): Change your mind? Get an instant refund.
- [How to Contact Support](https://help.trmnl.com/en/articles/12410454-how-to-contact-support): Need more help? Contact our support through online chat or email.
- [Debugging native plugins](https://help.trmnl.com/en/articles/11135276-debugging-native-plugins): Resolve markup, data visibility, and more in the browser.
- [LLM-ready docs](https://help.trmnl.com/en/articles/11157496-llm-ready-docs): Navigate TRMNL guides with AI friendly formatting.
- [What is a Virtual Device](https://help.trmnl.com/en/articles/12410512-what-is-a-virtual-device): A virtual device is a software only device that allows developers to start building and testing before the physical hardware arrives.
- [Refund and Exchange Policy](https://help.trmnl.com/en/articles/11753628-refund-and-exchange-policy): Terms, conditions, and policy for TRMNL return inquiries.
- [Framework Design Docs](https://help.trmnl.com/en/articles/12410486-framework-design-docs): When building plugins, the Framework design documents provide the tools necessary for readability, layout, and functionality when designing plugins.
- [BOYD / BYDO / BDYO](https://help.trmnl.com/en/articles/12494392-boyd-bydo-bdyo): Did you mean BYOD (Bring Your Own Device?)
- [TRMNL+ FAQ](https://help.trmnl.com/en/articles/11861887-trmnl-faq): Benefits of (optionally) subscribing to Plus.
- [Using Data Mode to Redesign a Native Plugin](https://help.trmnl.com/en/articles/12306729-using-data-mode-to-redesign-a-native-plugin): The Plugin Merge strategy let's you rewrite the markup for native plugins, such as Weather, to customize it exactly how you prefer.
- [Redirect Plugin](https://help.trmnl.com/en/articles/11035846-redirect-plugin): MITM your device <> core web app request / response journey.
- [TRMNL Hackathons](https://help.trmnl.com/en/articles/12591595-trmnl-hackathons): We run regular plugin hackathons focused on a specific theme, awarding prizes to the top plugins submitted and additionally discounts for participants who submit quality entries.
- [So richtest du dein neues Gerät ein](https://help.trmnl.com/en/articles/12593804-so-richtest-du-dein-neues-gerat-ein): Auspacken und dein TRMNL zum ersten Mal verbinden
Deutschsprachige Anleitung/German Quickstart Guide
- [Tempest Weather Station](https://help.trmnl.com/en/articles/10447991-tempest-weather-station): Dedicated e-ink screen for your local climate.
- [Partnerships and Collaborations](https://help.trmnl.com/en/articles/12677762-partnerships-and-collaborations): We are always open to chat about a partnership opportunities. Let's talk!
- [Developer Edition Features](https://help.trmnl.com/en/articles/12410549-developer-edition-features): Learn what benefits a developer license offers for your device.
- [Import: The ZIP file does not contain settings.yml](https://help.trmnl.com/en/articles/12687284-import-the-zip-file-does-not-contain-settings-yml): Importing a plugin and getting an error? Here are a few troubleshooting steps.
- [429 Rate Limit](https://help.trmnl.com/en/articles/11652861-429-rate-limit): Understanding this error screen on your device.
- [TRMNL is (not) a clock](https://help.trmnl.com/en/articles/12746770-trmnl-is-not-a-clock): Why the device is not designed to show the actual time
- [Ways to Distribute Devices and Plugins to Borrowed Devices](https://help.trmnl.com/en/articles/12838614-ways-to-distribute-devices-and-plugins-to-borrowed-devices): If an employer wants to provide TRMNL devices to its employees and make sure company information is available, there are a few ways to do this: managed device mirroring, unmanaged with unlisted plugin distribution, and self-hosted server management.
- [How to replace your internal components](https://help.trmnl.com/en/articles/12082769-how-to-replace-your-internal-components): In case you change them yourself or receive replacement parts for a screen (EPD), PCB board, or battery, we'll cover step-by-step how to disconnect the internals of a TRMNL OG unit.
- [Plugin Composer](https://help.trmnl.com/en/articles/12881005-plugin-composer): Design plugins for small screens with simple drag-and-drop
- [Robinhood](#): Monitor your portfolio performance over time.
- [Tidbyt](https://help.trmnl.com/en/articles/12430929-tidbyt): Integrate your Gen1 or Gen2 device with TRMNL.
- [BYOD: Enter My MAC Address](https://help.trmnl.com/en/articles/12601005-byod-enter-my-mac-address): If you get the error, "Please match the requested format" when entering the MAC address in your device settings, you need to check the characters you use.
- [FW1.6.2 troubleshooting](https://help.trmnl.com/en/articles/11934315-fw1-6-2-troubleshooting): Tips to roll back or force-update your device.
- [Preloading and Maintaining Managed Devices for Individuals](https://help.trmnl.com/en/articles/12835885-preloading-and-maintaining-managed-devices-for-individuals): Deliver the value of TRMNL to your team without giving over software access or plugin management. They connect the device to WiFi and it just works.
- [Registering your MAC address](https://help.trmnl.com/en/articles/12247206-registering-your-mac-address): Understanding this firmware error screen
- [Hardware specs for Custom authorities](https://help.trmnl.com/en/articles/11327036-hardware-specs-for-custom-authorities): EC related content to pass inspections in your country.
- [Withings](https://help.trmnl.com/en/articles/12145603-withings): Weight and health data.
- [QA Pass or Fail Message](https://help.trmnl.com/en/articles/13222330-qa-pass-or-fail-message): Your TRMNL device is showing a screen that says either "Pass" or "Fail" and a further message about temperatures and QA test.
- [Tuning a washed out display](https://help.trmnl.com/en/articles/12566040-tuning-a-washed-out-display): Using temperature profiles to improve color and shadows.
- [Find your Friendly ID](https://help.trmnl.com/en/articles/12632379-find-your-friendly-id): Understanding your TRMNL's unique and human-friendly identifier.
- [Volume Pricing](https://help.trmnl.com/en/articles/11872041-volume-pricing): Discounts for bulk or group orders.
- [Home Assistant Integration](https://help.trmnl.com/en/articles/12494449-home-assistant-integration): Are there any Home Assistant recipes or plugins? Yes!
- [Playlist Groups (Legacy)](#): Displaying unique content at different times of the day.
- [Netatmo Weather Station](https://help.trmnl.com/en/articles/13179789-netatmo-weather-station): Dedicated e-ink screen for your local climate.
- [Parsing plugins with the Sandbox Runtime](https://help.trmnl.com/en/articles/12996946-parsing-plugins-with-the-sandbox-runtime): Advanced feature for private plugins with large payloads.
- [What fonts are used in Framework?](https://help.trmnl.com/en/articles/12494341-what-fonts-are-used-in-framework): Fonts selected for TRMNL are designed to look great on e-ink devices. It's important to consider that the PNG screen generated will look different on an LCD monitor vs the e-ink display.
- [Plugin Not Receiving Data from Polling URL](https://help.trmnl.com/en/articles/12386583-plugin-not-receiving-data-from-polling-url): When a polling URL is accessible with your browser, but is not returning any data in Your Variables within your plugin, it may be blocking our cloud rendering server connection.
- [Syncing Plugins with GitHub](https://help.trmnl.com/en/articles/13465101-syncing-plugins-with-github): Using two workflows in GitHub Actions, push and pull changes between TRMNL and GitHub for your plugins to always keep them in sync.
- [Sound During Screen Refresh](https://help.trmnl.com/en/articles/12409934-sound-during-screen-refresh): If your device is making an audible sound during screen refresh, such as a buzz or buzzing noise, here are some options to assist you if you wish to minimize or remove the sound.
- [Seeed Studio Devices: Xiao, DIY Kit, and reTerminal](https://help.trmnl.com/en/articles/12408721-seeed-studio-devices-xiao-diy-kit-and-reterminal): We partnered with Seeed Studio so customers of their hardware could benefit from the plugin ecosystem and screen generation features of TRMNL via a BYOD license.
- [Reusing Markup with Shared](https://help.trmnl.com/en/articles/13216853-reusing-markup-with-shared): Whether it is Liquid logic or using a template to render content, the Shared tab of the plugin builder is used by all markup views.
- [Refer & Earn](https://help.trmnl.com/en/articles/10345253-refer-earn): Benefits and ideas for sharing TRMNL with your network.
- [Recipe best practices](https://help.trmnl.com/en/articles/11395668-recipe-best-practices): Tips to get your plugin published with great UX and functionality.
- [Plugin in a Degraded State (Reset)](https://help.trmnl.com/en/articles/12384091-plugin-in-a-degraded-state-reset): How to reset warning messages about a plugin being in a degraded state and to prevent refreshes from stopping due to the failure to fetch a URL or because of an invalid URL.
- [Customizing TRMNL with Tailor](https://help.trmnl.com/en/articles/13545834-customizing-trmnl-with-tailor): Customize your splash screen and logo with TRMNL Tailor, saved directly to the firmware without interfering with firmware updates.
- [Using the Asana plugin](https://help.trmnl.com/en/articles/13455940-using-the-asana-plugin): Display your Asana tasks on your TRMNL.
- [Shopify](https://help.trmnl.com/en/articles/9502507-shopify): Sales and order stats, at your fingertips.
- [The Office](https://help.trmnl.com/en/articles/9654172-the-office): Your favorite quotes from your favorite show.
- [Flammability Ratings for Devices](https://help.trmnl.com/en/articles/12511853-flammability-ratings-for-devices): Explaining what testing and ratings have been done for TRMNL devices in regards to fire safety.
- [Understanding Color Palettes](https://help.trmnl.com/en/articles/12985974-understanding-color-palettes): It's not all black and white
- [Plugins::Base.process! -> StandardError: private_plugin](https://help.trmnl.com/en/articles/12814634-plugins-base-process-standarderror-private_plugin): Your new plugin's screen won't generate. After turning on debug logs, your private plugin generates errors about marionette or a TCP connection.
- [Notion](https://help.trmnl.com/en/articles/11882090-notion): Display pages and databases.
- [TRMNL for Android](https://help.trmnl.com/en/articles/11647499-trmnl-for-android): Convert your Android device into a TRMNL.
- [Workflowy](https://help.trmnl.com/en/articles/12676959-workflowy): View your flows and lists
- [Fera](https://help.trmnl.com/en/articles/12632936-fera): Ecommerce product and merchant review analytics.
- [Lunch Money](https://help.trmnl.com/en/articles/9613508-lunch-money): Simplified personal finances.
- [Is Bluetooth Available for TRMNL Devices?](https://help.trmnl.com/en/articles/12494427-is-bluetooth-available-for-trmnl-devices): TRMNL devices have a Bluetooth module as part of their chipset, however it currently is not used or supported by our firmware.
- [Using the TickTick Plugin](https://help.trmnl.com/en/articles/12406573-using-the-ticktick-plugin): Our built-in integration with TickTick.com allows you to pull your Project Tasks into your TRMNL easily.
- [Unexpected Events Showing in Calendar](https://help.trmnl.com/en/articles/12386506-unexpected-events-showing-in-calendar): If your calendar is displaying event information that you don't recognize or is not visible in your calendar source (e.g. Apple Calendar), especially if it is in a language foreign to you, you may have spam calendar invites in your ICS file.
- [Timezone Troubleshooting with Calendars and Other Plugins](https://help.trmnl.com/en/articles/12384412-timezone-troubleshooting-with-calendars-and-other-plugins): Calendar plugins use your account's timezone, while plugins may use a form field, your account's timezone, or nothing at all.
- [Command Palette](https://help.trmnl.com/en/articles/12132075-command-palette): Navigate TRMNL like a pro.
- [ChatGPT](https://help.trmnl.com/en/articles/10140115-chatgpt): What can ChatGPT help you with?
- [Finding your TRMNL Mac Address](https://help.trmnl.com/en/articles/10614205-finding-your-trmnl-mac-address): For debugging and customer support.
- [Manually flash firmware](https://help.trmnl.com/en/articles/10271569-manually-flash-firmware): How to set your device to a specific firmware version
- [Screenshot](https://help.trmnl.com/en/articles/10302121-screenshot): Capture any web page.
- [Applying the screen (anti glare) protector](https://help.trmnl.com/en/articles/10217443-applying-the-screen-anti-glare-protector): What is this screen film thing in my box?
- [How to replace your kickstand](https://help.trmnl.com/en/articles/11360753-how-to-replace-your-kickstand): In case you remove it or need replacement parts.
- [Translations and Localizations](https://help.trmnl.com/en/articles/10371653-translations-and-localizations): Accessibility improvements for your language or region.
- [Debugging private plugins](https://help.trmnl.com/en/articles/11586187-debugging-private-plugins): Resolve API, markup, JavaScript, and more in the browser.
- [Calculating BYOD and Dev Edition add-ons](https://help.trmnl.com/en/articles/11629486-calculating-byod-and-dev-edition-add-ons): Determine how many licenses you need, based on your goals.
- [Using Google Sheets with Private Plugins](https://help.trmnl.com/en/articles/11400219-using-google-sheets-with-private-plugins): How to turn a spreadsheet into a server and a database.
- [Mirroring a Device](https://help.trmnl.com/en/articles/10530871-mirroring-a-device): Sharing content from one device to another.
- [How refresh rates work](https://help.trmnl.com/en/articles/10113695-how-refresh-rates-work): Understanding when and how your device content is updated.
- [Apple Calendar](https://help.trmnl.com/en/articles/10313980-apple-calendar): Know what's on your schedule.
- [Using Google Docs with Private Plugins](https://help.trmnl.com/en/articles/11404697-using-google-docs-with-private-plugins): How to turn a document into a server and a database.
- [Weather](https://help.trmnl.com/en/articles/10033272-weather): Your local forecast.
- [Language Learning](https://help.trmnl.com/en/articles/10302173-language-learning): Discover new words in your target language.
- [Fastmail Calendar](https://help.trmnl.com/en/articles/10316976-fastmail-calendar): Know what's on your schedule.
- [Nextcloud Calendar](https://help.trmnl.com/en/articles/10356811-nextcloud-calendar): Know what's on your schedule.
- [Outlook Calendar](https://help.trmnl.com/en/articles/10208408-outlook-calendar): View your upcoming schedule, apointments, and tasks.
- [Parcel](https://help.trmnl.com/en/articles/10670813-parcel): Track package deliveries
- [Liquid 101](https://help.trmnl.com/en/articles/10671186-liquid-101): Start building custom TRMNL plugins with no coding experience.
- [Importing and exporting private plugins](https://help.trmnl.com/en/articles/10542599-importing-and-exporting-private-plugins): You worked hard developing your plugin - now share it!
- [Eight Sleep](https://help.trmnl.com/en/articles/10467974-eight-sleep): Coming soon.
- [Frequently Asked Questions](https://help.trmnl.com/en/articles/8797283-frequently-asked-questions): Pricing, use cases, and more.
- [GitHub Contributors](https://help.trmnl.com/en/articles/10302147-github-contributors): Summarized committer progress.
- [RSS Feed](https://help.trmnl.com/en/articles/10186142-rss-feed): Get updates from your favorite website, blog and online publications
- [Google Analytics](https://help.trmnl.com/en/articles/9922832-google-analytics): Web traffic and visitor analytics.
- [Gumroad](https://help.trmnl.com/en/articles/10075558-gumroad): See how much stuff you're selling.
- [Email Meter](https://help.trmnl.com/en/articles/10113402-email-meter): Benchmark stats from your Gmail or Microsoft inbox.
- [YouTube Analytics](https://help.trmnl.com/en/articles/9483658-youtube-analytics): See how your channel is doing, hands-free.
- [Statuspage](https://help.trmnl.com/en/articles/9987937-statuspage): Uptime and incident tracking for your tools.
- [Salesforce](https://help.trmnl.com/en/articles/9986527-salesforce): Opportunity views at a glance.
- [Shopping List](https://help.trmnl.com/en/articles/9977739-shopping-list): Simple tracker for upcoming purchases.
- [Todo List](https://help.trmnl.com/en/articles/9977738-todo-list): Simple tracker that supports "doing" and "done" lists.
- [Upcoming Movies](https://help.trmnl.com/en/articles/9977737-upcoming-movies): What's playing in theaters, now or in the near future.
- [beehiiv](https://help.trmnl.com/en/articles/9883235-beehiiv): The newsletter platform built for growth
- [Readwise](https://help.trmnl.com/en/articles/9787214-readwise): Get the most out of what you read.
- [Simple Analytics](https://help.trmnl.com/en/articles/9575334-simple-analytics): Monitor web traffic, in peace.
- [Days Left (This Year)](https://help.trmnl.com/en/articles/8797325-days-left-this-year):
- [GitHub Commit Graph](https://help.trmnl.com/en/articles/8797310-github-commit-graph):

## Instructions

- Use Framework 3.1 (current). Framework 1.2, 2.3, and 3.0 are available for compatibility.
- All framework CSS classes use the `--` separator (e.g., `w--full`, `bg--black`, `gap--md`).
- Framework is designed for ePaper displays: 1-bit (black/white) and 2-bit (4 shades of gray).
- Layouts are built with `view`, `layout`, `title_bar`, and `columns` primitives.
- Use the Overflow and Clamp engines for handling content that exceeds available space.
- The framework runtime automatically adapts layouts to device bit-depth and orientation.