Can't find the right component?
Describe it and Shuffle AI builds it in seconds, ready to edit and export.
Browse 365 ready-made components from the Asitrastudio UI library. Every variant is fully responsive – copy the code or customize it in the visual editor and export clean code.
asitrastudio
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 compact rounded notification banner with a light green fill, green outline, and a checkmark icon confirming that settings have been saved. It is centered on a plain white background and has no 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 light-background team section with a large heading on the left and a three-column grid of circular profile photos, each labeled with the role Executive Chairman and a person's name. A text link labeled See more people sits beneath the heading.
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-background services section with a large 'Services' heading and three numbered rows, each pairing a large title with right-aligned descriptive text and an arrow icon, separated by horizontal rules. A faded architectural floor plan image overlaps the first row, giving it an editorial, minimal 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 centered introductory paragraph about a real estate investment firm with an underlined text link, followed by a row of four rounded outlined cards displaying key metrics such as clients, projects, units sold, and area designed. The layout is a centered stack transitioning into a horizontal row of stat cards on a light 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 horizontal top navigation bar with a wordmark logo on the left, four text links (About, Services, Projects, Contact us), and an outlined pill-shaped call-to-action button labeled "Get consulation" with an arrow on the right. The layout is a single row with a white background and black text.
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 modal dialog titled 'Sign in to studio' with Google and Apple sign-in buttons, an OR divider, email and password fields, a Forgot Password link, and a disabled-looking Login button. A close icon sits in the top right corner.
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-background section with a large heading "Meet our partners" and a text link "I will become a sponsor" on the left, paired with a two-row grid of eight partner logos (YouTube, Visa, IKEA, Microsoft, Amazon, PayPal) on the right. It functions as a social proof strip for sponsors and partners.
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-background cookie consent notice with a bold heading, explanatory body text, a close icon, and two action buttons: a filled black "I accept" button and an outlined "Settings" button. It appears as a horizontal banner that asks users to consent to cookies and related technologies.
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 project showcase section headed "Selected projects (21)" with category filter tabs (All, Villa, Residance, Apartaments) above a vertical list of project rows, each showing type, location, name, and an arrow link. A large rounded architectural rendering sits to the right as a preview 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 dark footer section with a centered newsletter heading, email input with subscribe button, and a four-column link area including company links, a Hiring badge, and social icons, plus copyright and legal links at the bottom.
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-background FAQ section with a large heading and eight collapsible questions arranged in two columns, each with a circular downward arrow toggle and a horizontal divider line. It is used to present frequently asked questions about wine investing.
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 horizontally scrolling blog section with a large heading, circular previous/next arrow buttons, and rounded article cards showing image, category tag, read time, title, and excerpt. A centered 'See our blog' text link sits below the carousel, and the third card is cropped at the right 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 minimal light-background section headed by large 'Open Positions' text, with a pill outline button at top right and a vertical list of four job rows, each showing employment type and remote status above a job title with a diagonal arrow link and a divider line.
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 titled Premium Membership showing three plan columns (Free, $29/month, $59/month) with feature checklists, Get started buttons, and a Billed monthly/yearly toggle with a 20% SAVE badge. The highlighted middle plan uses a solid blue CTA and a blue gradient background to differentiate it.
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 testimonials section with a large heading, circular previous and next arrow controls, and a featured quote card pairing a photo of a person in a yellow hoodie with a paragraph of text and the author name and title. A partial second card peeks in from the right edge, indicating a horizontal carousel.
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 hero section promoting a mobile app with a bold heading, a 'Full Time' pill label, and App Store and Google Play download badges. A tilted phone mockup on the right shows a Bitcoin send-to-friend screen with a numeric keypad.
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 full-width error page section showing an "Error" badge, a large "Error 404" heading, a short body paragraph, and a "Back to homepage" text link above a wide rounded architectural photograph. The layout is a stacked top header with a single image banner beneath.
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-background section with four partner logo tiles (Microsoft, PayPal, Spotify, Visa) above a large centered heading 'Meet our partners' and a short gray supporting paragraph. It is a centered stacked layout used to show partner or social proof.
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 newsletter subscription section with a large heading, supporting paragraph, and an email input paired with a black Sign Up button. Circular user avatars are arranged around the headline on both sides, creating a light-background call to action.
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 full-width dark hero section with a small eyebrow label, a large two-line sans-serif heading, a muted supporting paragraph, and a single blue pill-shaped call-to-action button with an arrow icon. The content is centered in a vertical stack with generous whitespace.
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.
