@humanforest/frames

Presentation frames for staging prototypes at true scale.

| Component | What it frames | | --- | --- | | FDeviceFrame | A phone. Photoreal hardware, live HTML screen at the model's true logical points, OS-authentic status bar, measured safe-area insets. | | FBrowserFrame | A desktop browser window, screen sized to a real display aspect (16:10 or 16:9). | | FFitFrame | Neither — it lays a slot out at a fixed logical width and scales the result down to fit. Use it to place either frame on a page narrower than the frame itself. |

<script setup lang="ts">
import { FDeviceFrame } from '@humanforest/frames';
</script>

<template>
  <FDeviceFrame model="iphone-16-pro" full-bleed touch>
    <RiderApp />
  </FDeviceFrame>
</template>

The device registry (DEVICES, findDevice) carries screen points, safe-area insets, cutout type and art metadata for 25 models. artUrl(device) resolves the bundled render.

Distribution

Private channel only. This package is bundled into the giget layer (packages/nuxt-layer) and is never published to public npm — see the licence below for why.

Art licence

The hardware renders in src/art/ are unmodified Wikimedia Commons vectors under CC BY-SA 4.0. Attribution is a condition of the licence and must be displayed wherever the art is shown; ART_CREDITS exports the deduped list for exactly that.

• Rafael Fernandez (Goldenbox) — most iPhone renders
• Mliu92 — Pixel 8/9/10 renders
• DM115Wiki — Pixel 8a / 9a renders
• Hajoon0102 — iPhone SE (3rd gen)

Share-alike attaches to the SVGs. Redistributing them outside the private channel would extend that obligation to whoever receives them, which is why the public npm packages ship no device art.

Artwork licence

The device renders in src/art/ are unmodified Wikimedia Commons vectors under CC BY-SA 4.0, by Rafael Fernandez, Mliu92 and DM115Wiki. Attribution is a condition of that licence rather than a courtesy: see ATTRIBUTION.md, and keep that notice with the art wherever it is redistributed or displayed — a published build, an exported PDF, a hosted deck. The art stays CC BY-SA; the rest of this package does not become CC BY-SA by containing it.