Sidequest Bento

Your work has a few sides. Show them.

A bright bento opening, projects worth opening and a process people can follow. Sidequest Bento brings four independent Framer components to portfolios with more than one kind of work.

Framer code component kit

US$39 · one-time purchase

US dollars. Applicable taxes appear at checkout.

Odd Hours portfolio made with Sidequest Bento, showing an uneven tile overview, original vector artwork and project previews.

Your poster and product study belong together. So does that side project which somehow became your favourite. Give the collection a home that leaves room for all of it.

Open with an uneven tile composition, turn a note over and let visitors choose a project category. Each project opens into its own detail view. A separate process section shows how you get from a first thought to something worth sharing.

The Odd Hours example mixes cobalt, citrus and soft violet with four original vector studies. Change the words, images, colours and fonts in Framer’s property panel. Arrange the four components around your own work. The boxes are organised. Your ideas can remain pleasantly unruly.

A good fit for

Designers, independent creators and small creative studios presenting work across graphics, products or spaces.

Four pieces. Room for your work.

Bento Overview

Bento Overview

An uneven tile opening with editable branding, imagery, navigation, CTA and a note visitors can flip.

An uneven tile opening with editable branding, imagery, navigation, CTA and a note visitors can flip.

Bento Projects

Bento Projects

A filterable collection of up to eight projects. Open each case in a detail dialog, then follow an optional project link.

A filterable collection of up to eight projects. Open each case in a detail dialog, then follow an optional project link.

Bento Process

Bento Process

A visitor-controlled sequence of up to six steps with editable titles, descriptions and imagery. Buttons and arrow keys move through the process.

A visitor-controlled sequence of up to six steps with editable titles, descriptions and imagery. Buttons and arrow keys move through the process.

Bento Footer

Bento Footer

A studio introduction, status and your own contact destination, with optional social links.

A studio introduction, status and your own contact destination, with optional social links.

Includes four self-contained component source files, individual Framer insert links, four original SVG example artworks and an English setup guide.

Open the guide. Bring your work.

Download the kit after checkout and open START-HERE.html. Choose a component and paste its insert link into your Framer canvas. Arrange the four pieces, then change the text, images, colours, fonts and links in their property controls. The guide also includes a source-file installation option.

A Framer account and basic familiarity with the canvas and property panel. Framer hosting plans and any connected third-party services are purchased separately if your site needs them.

A few useful answers.

Can I use the four pieces separately?

Can I use the four pieces separately?

Yes. Each component has its own insert link and self-contained source file. Use the complete Odd Hours arrangement or add only the sections your website needs.

Yes. Each component has its own insert link and self-contained source file. Use the complete Odd Hours arrangement or add only the sections your website needs.

Can I edit it without writing code?

Can I edit it without writing code?

Change the main text, images, colours, fonts and links through each component’s Framer property controls. The visuals inside a code component are edited through those controls. They do not become separate native canvas layers.

Change the main text, images, colours, fonts and links through each component’s Framer property controls. The visuals inside a code component are edited through those controls. They do not become separate native canvas layers.

How do I add my projects and process?

How do I add my projects and process?

Edit the Projects array for up to eight cases and the process Steps array for up to six steps. Categories come from your project entries. Each case can include your own destination link. Content is managed through controls; a CMS, backend and contact-form service are outside this kit.

Edit the Projects array for up to eight cases and the process Steps array for up to six steps. Categories come from your project entries. Each case can include your own destination link. Content is managed through controls; a CMS, backend and contact-form service are outside this kit.

What happens after purchase?

What happens after purchase?

Lemon Squeezy provides the download. Open START-HERE.html for four insert links, a source-file alternative and editing notes. One purchase covers one completed website. We handle orders, access and defects; the guide covers routine setup.

Lemon Squeezy provides the download. Open START-HERE.html for four insert links, a source-file alternative and editing notes. One purchase covers one completed website. We handle orders, access and defects; the guide covers routine setup.

One completed website

One completed website

One purchase covers one completed personal, commercial or client website. You can edit the components and use the included SVG artworks within that website. Keep the reusable kit and artwork files out of products you resell or redistribute.

One purchase covers one completed personal, commercial or client website. You can edit the components and use the included SVG artworks within that website. Keep the reusable kit and artwork files out of products you resell or redistribute.

Guide and support

Guide and support

For order, download-access or reproducible defect issues, use the seller contact details on your receipt. The included guide covers installation and everyday editing.

For order, download-access or reproducible defect issues, use the seller contact details on your receipt. The included guide covers installation and everyday editing.

Seven-day conditional refunds

Seven-day conditional refunds

Contact the seller within 7 days for duplicate purchases or charges, unresolved delivery failure, or a material defect or advertised-feature mismatch that cannot reasonably be fixed. Timely requests stay open during investigation. Mandatory rights and Lemon Squeezy rules apply; see the included licence for the full policy.

Contact the seller within 7 days for duplicate purchases or charges, unresolved delivery failure, or a material defect or advertised-feature mismatch that cannot reasonably be fixed. Timely requests stay open during investigation. Mandatory rights and Lemon Squeezy rules apply; see the included licence for the full policy.

Wuren Studio. Useful starts for independent work.

Paid orders and delivery are handled by Lemon Squeezy.

For order or product issues, use the seller contact shown on your receipt.

Create a free website with Framer, the website builder loved by startups, designers and agencies.