← Back to all posts

Introducing Frame, a Standalone Live Previewer

when we need a product render, our designer spends hours moving light bulbs around in KeyShot. then we click export and wait 2 days.

when you* need a quick render, there's trmnl-frame.

how it works

get the trmnl-component JS library:
https://github.com/usetrmnl/trmnl-component

drop it into your project:

<trmnl-frame id="trmnl" color="wood" dark="true">
</trmnl-frame>

inject some markup:

const trmnl = document.getElementById('trmnl');
trmnl.setHTML("<div class='layout'><div class='title title--large'>Every meal you eat is one less meal you'll eat.</div></div>");

... and you're done.

no code solution

you can also download our free Mockups libraries and use photopea.com for a 100% free, zero install approach: https://github.com/usetrmnl/mockups

Ryan Kulp

Founder at TRMNL