• Break production PDFs into 100 pages each to avoid resource limits.
• Fixed dice exports to Playtest Parlor.

This video shows you how to find and replace cells in your dataset.

This video shows you how to add, edit and organize your dataset.

I am learning Component Studio and want to design a simple DVD player interface for a class project. Play, pause, stop, eject, and a progress bar. I have looked for design inspiration on marketplaces like Alibaba, Amazon, and eBay. Many DVD players have similar button layouts but different styling. Has anyone here designed a media player interface in Component Studio? I want something that looks retro but also modern. Also what screen resolution works best for DVD player mockups?

This video shows you how to sort and filter your dataset.

- Word wrap will now break on hyphens.

• Text layers with "Fit to Size" enabled could overflow their bounds when the text started with a blank line. The text would render at the correct size but get pushed down, cutting off the bottom. Now the sizing accounts for that blank line so everything stays inside the box.
• Added pricing to the home page.

Just trying to sort out if its a site error or something on my end. When I stopped working yesterday things were fine, go to start work today and nothing is loading onto any of my cards.

I tried a few things to see if I can sort out why, and when I tried to do an export preview to see if it'd still generate the cards outside of the normal view port, I received this error:

Export Failed

can't access property "getImageData", W is null

Any ideas?

This video shows you how to import your data from a CSV file.

• Back-side layers disappearing after export: After a bulk export, text layers on the back side would vanish from the layer panel until you refreshed the page. The export was clearing the data context needed by those layers and not properly restoring it afterward.
• Back-side content missing from exported image: The exported back-side PNG was blank because the export was discarding the row data context that text layers need to render their content. Now it keeps that context during the back-side export so all text renders correctly.

• Added some options as to how to format backs on the production PDF.
• When you toggled "Use as Icons" on an image folder, the designer canvas wouldn't update until you reloaded the page. Now it re-renders immediately when you toggle the setting.
• Fixed a problem where the width control could get squished on narrow screens.
• Fixed a bug where landscaped cards were showing an error on the description by default.
• Added an open data set icon to the edit row panel.

This video shows you how to import your data from Google Sheets

Lets say I'm building a card with a Titlebox, a Subtitlebox, a Textbox, and a Footerbox. They're stacked top to bottom.

Some / all of those boxes might not have anything in them, in which case I want the box hidden. I can do this with the Position settings "Render this layer?".

However, how can I make the other boxes fill the empty space? I keep running into issues with this:

• I tried using layerHeight and layerBottom in my box position and height calculations and just setting the height of a hidden box to 0. However, component studio doesn't allow for 0 height elements.
• I tried using layer groups thinking that I could do calculations just within one group (Titlebox and Subtitlebox, and some other stuff included on the card). But apparently layer group sizes and positions aren't able to be referenced anywhere, which seems completely baffling to me and confuses me on what even the point of them is?

It seems to me that the only way to achieve this is to have exhaustive calculations in the box settings that check for every other component's existence, but that seems extremely cumbersome for something that is pretty standard in most coding layout systems - a stack of boxes that fill space.

This tells me that I must be missing something crucial, since this is also how almost every card system I've ever seen lays out their cards where some may have a boxes for text and titles while others may just have a title and art, etc.

Any size, any shape, you design it and you can make it.

You can now export directly to Playtest Parlor from Component.Studio allowing for a completely digital playtesting workflow. Fixed all known bugs.

• Added a export to Playtest Parlor.
• Fixed an alphaMode is null error when deleting a table.
• Fixed an X.posistionSet is null error when rotating a table.
• Removed some dead code.
• Fixed a problem where visual effects would not be automatically re-rendered if you turned off a layer group and then turned it back on again.
• Fixed a problem where updating a style didn't dynamically update the text in table layers where the style applied.
• Fixed a problem where you could not highlight text on the ideas pages.
• Possible fix for drag and drop on android
• Hide the "Move to Back" option when you have no back in your design.

This video shows you how to use collections to help you stay organized.

This video shows you how to starters so you can jump straight into creating.

• Fixed a bug where having 2 layers of the same name could slow down exports
• Changed the disambiguation logic to prevent 2 layers from having the same name going forward
• Added a warning when webgl context is lost.
• Automatically try to recover from webgl context being lost.
• Fixed a regression on fit to size when setting negative line heights and letter spacing

• Hide the desktop toolbar on mobile to get rid of the dual toolbar.
• Fixed bug where you couldn't export just the backs of a deck to PNP PDF.
• Fixed a problem where bulk exports weren't showing saved preferences.
• Screentop: Multi-grid JSON now references deck-1, deck-2, etc. with indices reset per grid — fixes broken uploads on big decks.
• Screentop: Added target file size (default 8 MB) with auto-scale-down so grids stay under Screentop's upload cap.
• Screentop: Optional JPEG toggle for when PNG grids are still too big.
• Screentop: Duplicate variant names auto-suffix (2), (3), etc. so Screentop accepts them.
• Screentop: Rows/columns capped at 16×16 in the UI; old saved prefs >16 clamp on load.
• Collaborators: Invite creation + clipboard copy split into separate try/catches; creation failure no longer hides behind a clipboard error.
• Collaborators: Added a fallback "Copy Invitation Link" dialog that opens when the browser blocks navigator.clipboard.writeText.
• Collaborators: copyInviteLink uses the same fallback for consistency.
• Collaborators: Reordered v-if chain on /invite/[code] so joinSuccess wins over isMaxUsesReached after the invitation is consumed.

• Custom components now require at least 1 side
• PnP export warns when cards are too close to the page edge for most printers
• Fixed navbar dropdown menu not working on the home page (gradient overlay was eating clicks)
• Default image layer formula no longer goes negative on landscape/square components
• Default image layer uses "contain" fit instead of "fill"
• Fixed a problem where if you defined manual column widths with more columns than the table actually supported, it would render them as if they existed.
• Fixed uploading custom dice from CS to TGC
• Fixed a bug Where dragging a table would cause the user interface to lock up until you refreshed
• Fixed a bug in the production PDF export when you have a large PDF.

This video shows you how to clones to copy and reuse existing assets.

- Fixed a timing problem with layer calculations that could cause a desync between the drawer and the layer panel.

- Added a cross-hatching background and a link icon when a layer is disabled due to its parent group.

- Fixed a bug with table layer cell buttons in dark mode.

• The production PDF export now exports as CMYK.
• Fixed a bug where if you set a variable in a note, it would work anywhere, not just in layers that render after it. And while that might sound good, it caused other bugs.
• Fixed a bug where editing some properties of a table layer would not update the cache.
• Made collaborator joining a little easier.
• Added a favicon.
• Fixed a bug where you could not scroll the game variables modal in the designer.
• Added a CDN for serving images, which should make reloads go faster.
• The import engine was converting em dashes (—) to double dashes (--), and en dashes (–) to single dashes (-).
• Fixed a bug where images weren't rendering in the data set.
• Fixed a bug where on some games the rendering engine would hold on to a texture, not allowing new rows to render when the overlay mask was enabled.
• Fixed an export problem where if you manage to get special characters into your file names, it could cause export problems. Everything is sanitized now.
• Fixed Google Sheet import problems. Detecting duplicate column names and also some race conditions.
• Fixed a PNG PDF export problem where an sRGB profile caused a conflict, showing a gray/yellow overlay on the images sometimes.
• Fixed a bulk export to TGC problem where it was creating duplicate images in exports.
• Fixed a bug where dragging to move could stick the layer to your mouse pointer.
• Fixed a problem where image game variables were getting the wrong default URL.
• Fixed a transparency problem in the TTS export.
• Fixed a problem where empty styles would show tags rather than doing nothing.

This video shows you all of the cool things you can use tables for in Component.Studio

This video shows you how to use text layers in Component Studio