> ## Documentation Index
> Fetch the complete documentation index at: https://docs.openfinance.tech/llms.txt
> Use this file to discover all available pages before exploring further.

# LinkFlow

> Open your product site on a misty landscape that loops forward and back with no visible cut, under a sage green headline and a white glass navigation bar.

The copy is written for a fictional workflow automation product called LinkFlow, ready for your own name and words. It sits under **Websites** in Mainframe.

![Hero with a LinkFlow logo, a white glass nav pill with Purpose, The Process, Tariffs and Try it Live, a green headline reading Close the rift linking signals and action, over a misty stone arch landscape](https://mintcdn.com/openfinance/-pu5SodoQuhEwuR-/images/mainframe/linkflow.jpg?fit=max\&auto=format\&n=-pu5SodoQuhEwuR-\&q=85\&s=b5e38433f78fe1d84fc215e50f2bab2f)

The demo: glass nav pill, two-tone headline and the bottom CTA block over the video

## Who it is for

SaaS and AI tool makers looking for a calm, premium landing hero are the obvious fit. It is also a good model for anyone who wants a looping video without a jump at the loop point.

## What it does

* **Boomerang background.** The video plays once while its frames are captured, then loops forward and backward at 30 frames a second, so there is never a visible cut.
* **Navbar** with the logo, a white glass pill (Purpose, The Process, Tariffs and a "Try it Live" button), plus "Sign Me Up!" and "Enter".
* **Headline** "Close the rift linking signals and action" in two greens, with a one-line subhead.
* **Bottom-left CTA block** with a product badge, a short paragraph, "Try it Live" and "Know More.", and a "How we build?" video link at the bottom right.
* **Mobile drawer** that slides in from the right with staggered links.

## What it needs

* No OpenFinance key and no trading.
* GitHub and Vercel to keep the code and deploy it.
* Stack: React 18, TypeScript, Vite, Tailwind CSS and lucide icons. Output: a Vite app.

## Deploy it

**1. Check the demo**

Open it and watch the loop reverse.

**2. Deploy**

Click **Deploy** on the card.

**3. Ship it**

Push to GitHub and deploy to Vercel from the chat.

## Ideas to customize

Two requests to start from:

```text theme={"system"}
Rename the product to "Relay", change the headline to "Every alert, one place", and make the accent blue.
```

```text theme={"system"}
Add a pricing section below the hero with three plans, using the same glass style.
```

## Limits

* It is a hero only. The nav links point to sections that do not exist yet, and the buttons do nothing until you wire them up.
* If you swap the video, host it somewhere that allows cross-origin use; the boomerang reads the frames in the browser and cannot do that otherwise.
* The fonts and video come from outside hosts named in the prompt. Use assets you have the rights to for a real brand.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.