Browse 418 ready-made components from the Bendis UI library. Every variant is fully responsive – copy the code or customize it in the visual editor and export clean code.
Bendis
Full Shuffle Editor access for just $10
Great for quick projects and for testing everything Shuffle can do. One-time payment, not a subscription.
Get 7-Day PassNew to Shuffle? Try our tools:
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A grid of five abstract paint images on a solid blue background, with two wide images on top and three narrower images below. The component displays artwork only, with no visible text, navigation, or interactive controls.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A horizontal row of four brand logos on a white background, used as social proof on a marketing page. The logos are spaced evenly and are not interactive in the visible image.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A split-screen error page with an abstract painting on the left and a light panel on the right showing a bold 'Page not found' heading, apology text, and two buttons to return to the homepage or try again. The angled divider between image and text panel gives it a distinctive layout.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A split-screen authentication section with a bold marketing headline and body copy on the left and a white sign-in card on the right containing email and password fields, a terms checkbox, a yellow sign-in button, and Facebook and Twitter login buttons over a red textured background.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A white card overlaid on a blue header and a Google-style map of the San Francisco Bay Area, containing a bold heading encouraging quick action and address and contact email details in a two-column layout.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A light split-screen testimonial section with a large outlined quotation mark, bold blue heading, gray supporting text, and a named author attribution on the left, paired with a slanted-edge portrait photo of a man on the right. It uses placeholder Lorem ipsum copy to present a customer or team quote.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A centered marketing hero on a solid blue background with a small eyebrow label, bold white heading, supporting paragraph, a yellow primary button and an outlined secondary button, with a monitor mockup showing a dark file-management dashboard below.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A horizontal row of four outlined diamond-shaped stat cards on a light blue background, each displaying a bold blue percentage value (60%, 46%, 73%, 81%) above a small gray MARKET SIZE label. The layout is a simple statistics display for presenting market size figures.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A white card overlaying a map image, presenting a bold blue headline call to action on the left and address and contact email details on the right. It functions as a contact or CTA section within a marketing page.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A grid of six feature cards arranged in three columns and two rows under a 'New Feature' eyebrow label and heading. Each card has a blue icon tab at top-left, a bold question-style heading, and a bulleted list of supporting points, presenting product features in a marketing section.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A marketing feature section with a bold blue heading and four outlined numbered items with placeholder body text on the left, paired with a painting photograph cropped into a slanted parallelogram on the right. The layout is a split screen with a light background and no interactive controls visible.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A blog article header featuring a full-width photograph with a white triangular cutout containing breadcrumbs, a bold blue serif-free heading, an author avatar with name and date, followed by body paragraphs. The layout is centered with the text block stacked vertically beneath the hero image.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A pricing section with a centered heading and subtext, a Monthly/Yearly billing toggle, and three plan cards (Starter, Pro, Premium) listing prices, feature checklists, and "Try it now" buttons. The middle Pro card is emphasized with a solid blue background and a yellow call-to-action button.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A split-screen error page with a bold "Page not found" heading, short apology text, and two buttons ("Go back to homepage" and "Try again") on a light left panel. The right panel shows an abstract painting image with a diagonal edge.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A two-by-two grid of team member cards on a solid blue background, each showing a name, job title, and placeholder bio text beside an angled photo. A centered eyebrow label, bold heading, and intro paragraph sit above the grid.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A website footer with the Bendis logo, a short lorem ipsum tagline, five social icon buttons, four link columns (Company, Pages, Legal, Resources), and a divider with a copyright line below. Content is arranged in a horizontal row on a light blue background.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A centered marketing section introducing a new feature with an eyebrow label, bold blue heading, supporting paragraph, and two CTA buttons (yellow filled and outlined). Below, a monitor device mockup displays a dark file-management dashboard illustrating the product.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A grid of five abstract painting images arranged in a two-row layout, with two wider images on top and three narrower images below. The component contains only image content with no visible text, navigation, or interactive controls.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A horizontal row of three feature blocks, each with a yellow skewed parallelogram containing a blue line icon, a bold uppercase heading, and centered body text. The section uses a solid blue background with white text and no visible buttons or interactive controls.
Create a free account to copy production-ready code from every component in the library.
Free account · No credit card · No password needed
Already have an account? Sign in
A marketing hero section with a large blue headline, supporting paragraph, and yellow TRY DEMO button on a white inverted-triangle background, followed by three dark blue cards with line icons describing a team plan.
Build websites faster with an AI Visual Editor
© 2026 Shuffle. All rights reserved.
See what you're getting before you commit.
Switch the editor to Grid and every page of your project appears side by side on one canvas. Arrange them freely, zoom in and out, and add as many new pages as you need in a few clicks.
Describe what you need in one chat and the Agent does the rest: it adds new sections, edits copy and styles, moves blocks around or removes them across your whole page. No modes, no switching, just tell it what to change.
Not quite there yet? Ask for tweaks like missing assets, your logo or other details, and regenerate the design without starting from scratch.
