Uscreen Headless is a developer toolkit that lets you build custom front-end experiences powered by the Uscreen backend. Rather than using the Uscreen storefront, you can design and publish any web page or application, while using Uscreen to handle member authentication, subscription management, and access controls.
The first capability available is the Headless Login component: a drop-in Uscreen sign-in form you can embed on any custom page, paired with product gating that restricts content to members on a specific subscription. This article covers what Uscreen Headless is, how to generate your API key, and how the login and gating components work today.
đ NOTE: Uscreen Headless is currently in early access. Contact Uscreen to be considered for early access. The login and product-gating components are functional and available to use now. Additional components, including catalog, search, categories, and a video player, are in active development and will be added in future updates.
What Is Uscreen Headless?
Most Uscreen creators use the hosted storefront that Uscreen provides: the catalog, video pages, and checkout experience your members interact with every day. Uscreen Headless adds an alternative surface alongside that storefront, using a developer API and a set of drop-in components that let you (or a developer or AI builder tool) construct a fully custom web experience from scratch.
You keep everything Uscreen already handles: authentication, billing, subscriptions, content, member management, and analytics. What you can now replace or extend is the front-end, layout, design, and pages your members see.
This is particularly useful for creators who want to offer exclusive member-only content that lives outside the Uscreen catalog. Maybe this is a downloadable resource library, a gated blog, or a recipe list. These are all protected behind your existing Uscreen membership.
Getting Started
To build with Uscreen Headless, you need a Headless API key from your Uscreen admin. This is separate from the Publisher API key used for other integrations. This is only available if you are part of the early access. Uscreen must enable the Headless API key section for you.
Generating a Headless API Key
In your Uscreen admin, go to Settings.
Select Headless API.
Click Create New Key.
Give the key a descriptive name
Copy the key and store it securely. You'll add it to your headless project configuration.
đ NOTE: Keep your Headless API key private. Do not expose it in public-facing code. If a key is compromised, return to Settings > Headless API to revoke it and create a new one.
Building a Headless Page
Uscreen Headless components are designed to work with both developers writing code and AI builder tools like Claude Code, Codex, Cursor, Lovable, or similar platforms. If you're using an AI builder, you can provide it with the Uscreen Headless developer toolkit and your API key, and prompt it to build the custom page you have in mind. The AI tool handles the assembly. Uscreen handles the authentication and access control.
For creators with development resources, the components are built in React and are embedable in any React-based project.
đ NOTE: Custom development implementation is outside the scope of Uscreen Support. For implementation guidance, consult a developer familiar with React, or use an AI builder tool that supports the Uscreen Headless components.
Uscreen Headless Developer Toolkit Components
Login and Authentication
The Headless Login component adds a Uscreen-powered sign-in form to any custom page you build. Members sign in using the same Uscreen credentials they use on your main storefront â there's no separate account required.
The sign-in flow uses OTP authentication (a magic link sent to the member's email):
A visitor lands on your custom page.
If they're not signed in, the Uscreen login component is displayed.
The visitor enters their email address and receives a magic link.
They click the link to authenticate.
Uscreen checks whether the authenticated member has access to the content you've gated â and shows or hides it accordingly.
Access Gating
The access gate is what makes your custom page membership-aware. You configure it with a specific product or subscription ID from your Uscreen account, and it automatically determines what each visitor can see based on their active subscriptions.
Member has access: The protected content is displayed.
Member doesn't have access: The member sees a prompt to subscribe or is redirected to your Uscreen storefront.
This lets you tailor the experience precisely: for example, show an exclusive gallery only to members on your annual plan, or unlock a resource library for any paying member regardless of their subscription tier.
Current Capabilities
Login component: OTP (magic-link) sign-in using Uscreen member credentials
Product gating: show or restrict content based on a member's subscription
Headless API keys: generate and manage keys in Settings > Headless API
Coming later
Content catalog
Search
Categories
Video player
FAQs
Do I need a developer to use Uscreen Headless?
Not necessarily. The Headless components are designed to work with AI builder tools, so you can describe what you want and have the tool build the page for you. That said, some technical familiarity with how web hosting and APIs work will help you configure and deploy your project.
Can my members use the same login they use on my main Uscreen storefront?
Yes. Uscreen Headless uses your existing Uscreen authentication, so members sign in with their usual email and magic link. They don't need a separate account or password.
Can I use Uscreen Headless to play videos?
The current release focuses on login and product gating for non-video content. Things like pages, galleries, downloadable resources, and similar. A video player component is in development and will be added in a future update.
Where is my custom headless page hosted?
You host your custom page wherever you choose. This can be on your own domain, using Vercel, Netlify, or another hosting provider. Uscreen handles the authentication and access control only. Hosting the page is up to you.
Does Uscreen Headless work on mobile apps?
The current release is for web pages. Extending this level of customizations is planned for the native mobile and tv apps later.