Sewlore ยท Developer example

Two tools. A few lines of HTML.

Add a fabric stretch calculator or a PDF print scale checker to a sewing resource page. These examples load the live tools from Hugging Face; the calculations stay inside each embedded app.

The tool parameter selects the opening tab. Both tool tabs remain available in each frame.

Example 01

Fabric Stretch Lab

Record relaxed, stretched and released lengths. The tool calculates stretch percentage and records the change after release.

Frame unavailable? Open the fabric stretch calculator (new tab).

Copy this iframe

<iframe
  credentialless
  src="https://sewlore-sewlore-sewing-tools.static.hf.space/index.html?embed=1&amp;tool=stretch"
  title="Sewlore Fabric Stretch Lab: measurement inputs and results"
  width="100%" height="680"
  loading="lazy" referrerpolicy="no-referrer"
  style="border:0; display:block;">
</iframe>

Example 02

Compare a printed test square's width and height with its intended size. Check both directions before printing a complete pattern.

Frame unavailable? Open the PDF print scale checker (new tab).

<iframe
  credentialless
  src="https://sewlore-sewlore-sewing-tools.static.hf.space/index.html?embed=1&amp;tool=print-scale"
  title="Sewlore PDF Print Scale Checker: test square inputs and results"
  width="100%" height="680"
  loading="lazy" referrerpolicy="no-referrer"
  style="border:0; display:block;">
</iframe>

Copy a snippet, or select its text and use your browser's copy shortcut.

Before you embed

Choose the context, keep the fallback.

Use one tool frame per resource page when that is enough. Adjust its height to suit your layout, retain a descriptive title, and keep a visible link to the corresponding Sewlore page for visitors whose browser blocks the frame.

The frames scroll independently. This example does not read their inputs or send measurement data between the parent page and the tools.

Measurement privacy

The tool app calculates in the visitor's browser and does not upload entered measurements or add analytics. This starter adds no analytics, cookies or measurement collection. Hugging Face and the site hosting this example still receive normal web requests, such as the request to load a page or file. If opened in StackBlitz, that platform also receives the requests needed for its editor and preview.

In supporting browsers, credentialless loads each frame in a temporary context without existing cookies or storage. Its storage is cleared when the top-level page unloads, so persistent offline caching should not be assumed. Browsers that do not support the attribute keep their usual embedding rules; the visible fallback links remain available.

Source attribution is optional

These snippets intentionally omit source. Leave it out when embedding on Sewlore so navigation within the site is not labelled as a referral.

A partner may opt into attribution by adding &source=partner_name to the iframe URL. It tags outbound Sewlore links; it does not submit measurements. Replace partner_name with an agreed source value, and keep it out of the default embed unless the partner chooses it.