WUREN STUDIO / FREE FRAMER COMPONENT

Make it your frame.

Stillframe is a free showcase component with a layered portrait opening and up to three expandable cases. Add it to your own Framer page, then give the person and the projects your voice.

Paste the component into your canvas

Select and copy this entire component link:

1. Open your own Framer project and the page where the showcase belongs.
2. Select the destination canvas or content stack.
3. Paste with Ctrl+V on Windows or ⌘V on Mac. Paste into the Framer canvas, not the browser’s address bar.
4. Select the inserted Stillframe component. Its content controls appear in the property panel.

Set the opening

Edit Brand, Hero title and Hero subtitle. Set Portrait, Creator name, Creator role and Introduction to match your own work. Choose a portrait with room around the subject so the large type has space to sit.

The four supplied images are original AI-generated examples. The person and projects are fictional. Replace them with your own material, or keep a clear concept label when using the demonstration content.

Choose the cases to show

Work heading and Work introduction set the section’s opening. Expand Three works to edit the entries. It starts with three examples; you can remove entries and use up to three.

Each entry has Title, Category, Image and Summary for its overview. Use Case heading and Case text for the expanded story, then fill in Focus, Format and Project note.

Open and close a case with its buttons in Preview or on the live page. This is a visitor interaction, rather than a property-panel setting.

Finish the chapters and styling

Edit Notes heading, Notes text and Example note. Set Contact label and Contact link for your own contact action, then open that link once in Preview.

Dark, Light, Hero light and Dividers control the colours. Studio fonts uses the supplied cinematic type pair. Turn it off to choose your own families with Display font and Body font. Their size and spacing controls remain available. The Subtle motion switch controls the optional motion treatment.

Keep the small-screen version readable

Preview the page at phone width after replacing the content. If a headline becomes cramped, shorten the line or adjust the module’s available type controls. Check that your portrait and project images still show the important part of the work.

Visitors can reach the case buttons with Tab and activate them with Enter or Space. Stillframe follows the device’s reduced-motion preference so the content remains available with quieter transitions.

Use the included files

Unzip the package and open preview/index.html to explore the offline interactive example. Keep its folders together so the images load.

Stillframe.tsx and the four images in assets/ are included for your own source edits. Routine Framer edits use the component controls described above. Publish your website from your own Framer account; hosting and domain choices follow your account’s plan.

If an edit looks wrong

• The link opened a browser page: copy the full component link again, return to the Framer canvas and paste there.
• You selected the outside frame: select Stillframe itself to see its content controls.
• An image hides its subject: choose an image with more space around the subject.

For access or order issues, a broken delivery link or a reproducible defect, use the contact route on the Stillframe product page. Include the page URL and the steps that caused the issue. Setup and routine editing are self-service.

You can use Stillframe in completed personal, commercial and client websites. Read the short free-use license for the source-sharing terms.