@shadcnblocks

A short about hero with a large headline, one culture photo, and two titled story columns.

A two-column about section with sticky sidebar containing avatar and contact link, and main content with bio, philosophy, workspace image, and team list.

A portfolio-style about section with team photos, process description, logo marquee, awards list, quote overlay image, and motivation sections.

A structured agency about section with labeled sections, process cards with numbered badges, milestone stats, awards list, and testimonial with case study link.

A six-column about section with large story headline, team intro text, avatar profile card, philosophy paragraph, and full-width image.

A six-column about section with headline, full-width hero image, labeled intro text, avatar profile, and philosophy statement.

A dark two-column about section with a rotated polaroid-style photo card, headline, body text, and a handwritten signature.

A six-column about section with sticky Why Us label, quote-style headline, supporting text, full-width image, and three-row stats list.

A seven-column profile section with role and timezone info, bio text, interactive tab navigation, and tab-controlled image display.

A seven-column about section with mission and drive content blocks, each with label, headline, and supporting text, separated by a two-image row.

A seven-column about section with large bordered image on the left and headline, text, quote attribution with avatar on the right.

A comprehensive about block with centered intro, asymmetric image grid, stats section, logo strip, and benefit cards with testimonial.

A dark seven-column profile section with role info, two headline paragraphs, a handwritten signature image, and cropped portrait image.

A multi-section about block with hero image overlay, story section with milestone image and bullet points, and training cards on muted background.

A two-column about section with Framer Motion animations, vertical image on the left, and title with paragraphs and horizontal image on the right.

A company about section with a top-aligned label, split intro, full-width photo, two story columns, and a bordered stats grid.

A two-column profile section with avatar, roles, bio, location on the left, and client list with project counts and awards list with years on the right.

A comprehensive studio about section with Framer Motion animations, large title, partner avatars, hero image, stats row, and philosophy footer with CTA button.

A studio about section with monospace label, large two-part headline, stats list, three paragraphs, services checklist, stat cards, and full-width image with o…

A comprehensive enterprise about section with hero, value proposition stats, team grid with decorative borders, company logo grid, and investor logos.

A two-column about section with alternating image and text blocks, featuring staggered image pairs and multi-paragraph text with optional CTA.

A stacked about section with a large headline, image and mission overlay, then a three-column text grid of values.

A two-column about section with main image, breakout card, logo strip, and achievements stats grid on muted background.

A short about section with a centered headline, supporting paragraph, and an asymmetric three-photo row.

A six-column about section with large story headline, team intro text, avatar profile card, philosophy paragraph, and full-width image.

A six-column about section with headline, full-width hero image, labeled intro text, avatar profile, and philosophy statement.

A seven-column about section with mission and drive content blocks, each with label, headline, and supporting text, separated by a two-image row.

A seven-column studio about section with a bordered workshop photo, The Studio heading, supporting copy, a trust byline, and a View our work button.

A seven-column profile section with avatar, role, timezone, bio text, interactive tab navigation, and tab-controlled image display.

A mid-page about section with a start-aligned headline, a three-photo mosaic, and two titled text columns.

An about hero with a two-column headline and paragraph, a pair of culture photos, and an outline call to action.

A split about hero with a headline and supporting copy beside two stacked culture photos, two titled story columns, and an outline call to action.

A two-column freelancer about section with a sticky avatar sidebar, bio and approach copy, a workspace photo, and a numbered client list.

A centered about section with six-image grid, two-column vision and creators text blocks, and muted CTA banner.

A two-column studio about section with a sticky brand sidebar, The Studio heading, approach copy, a workspace photo, and a numbered awards list.

A developer-focused about section with two-column intro, large image, tech logos, origin story, and milestone cards.

A two-column about section with story text and staggered photo grids showing team and workplace imagery.

A narrative about section with offset image layout, product philosophy text, team photos, and careers CTA button.

A fintech-style about section with plus-sign pattern background, stats row, mission narrative, image carousel, and founding team.

A personal profile section with large team photo, role and location info with flag icon, bio text, and secondary workspace image.

A two-column invitation acceptance screen with Google sign-in, email input form, welcome message, and footer links.

A compact centered invitation card with organization logo, personalized message, and accept or decline buttons with an expiration notice.

A fullscreen split invite screen with workspace branding, stacked member avatars, a verified badge, inviter details, and accept or decline actions.

A centered invite confirmation card with inviter note, workspace access list, and a join action.

This component provides an interactive interface for managing and editing a list of addresses, allowing users to add, edit, and delete addresses with form inpu…

The AddressBook2 component is designed to manage a collection of addresses, allowing users to view, edit, add, and delete addresses within a card-based layout.…

Narrow checkout address picker with selectable radio cards, delivery estimates, and a side sheet for adding or editing a location.

A full application shell with collapsible sidebar, grouped navigation with submenus, user dropdown in footer, header with breadcrumbs, and placeholder content …

A support or helpdesk application shell with ticket sidebar, command palette search, conversation view with message input, and ticket category navigation.

A YouTube-style video platform shell with category sidebar, collapsible subscription sections, search bar in header, and user dropdown with account options.

Two-tier sidebar with collapsible panel, organization switcher, and animated transitions.

Top navigation bar with dropdown menus, search field, organization switcher, and mobile bottom navigation.

Cryptocurrency exchange interface with wallet menu, token favorites, notifications, and rounded navigation tabs.

An application shell with inset collapsible sidebar that collapses to icon-only mode, grouped navigation with submenus, user dropdown footer, and content area.

An application shell with horizontal top navigation bar featuring dropdown menus, search input, user dropdown, and mobile sheet menu for responsive navigation.

An application shell with horizontal top navigation using tab-style links, search input, user dropdown, and mobile sheet menu for responsive navigation.

An application shell with floating sidebar variant, grouped navigation with collapsible submenus, user dropdown footer, and toggle button in sidebar header.

An application shell with module switcher in sidebar, animated navigation transitions, badge counts on menu items, and drawer for mobile with motion effects.

A messaging-style application shell with channel sidebar, pinned items, user presence indicators, header with breadcrumbs and actions, and drawer for mobile.

An email client application shell with folder sidebar, workspace switcher, search input, message list with badges, and user dropdown with notification settings.

A code editor-style application shell with activity bar, file explorer sidebar with collapsible folders, and panel toggle for secondary content area.

A section with a large heading and a full-width table of award name, description, and year, with each name linked externally.

A two-column layout with a small uppercase label and sticky positioning beside a list of award titles and years separated by hairline borders.

A titled section with intro text and stacked rows showing a color marker, award title, categories, year, and a sliding accent background on hover.

A large display Awards heading paired with a parenthetical date subtitle above a table of logo chips, names, nominations, and years.

A serif-styled grid with a sticky sidebar label and large award titles where pointer movement drives a scaled preview image for the active row.

A display-size milestones heading over a labeled grid of milestone title, type, and year with horizontal separators between entries.

Two columns: intro and an accolade stack with separators on the left, and a product image band plus headline, copy, and three large stats on the right.

This component generates a full-screen background pattern with a radial gradient effect, applying customizable styles through optional class names. It features…

This component creates a visually appealing background with a grid pattern using CSS gradients, which is centered and takes up the full width and height of the…

A full-height section with two large bottom-corner radial gradients, heavy blur, desaturated SVG noise on top, and centered pattern placeholder.

This component renders a full-screen section with a diagonal cross grid background pattern, making it suitable for visually distinct layouts. It accepts a `cla…

A full-height centered section whose primary dot grid is masked so the pattern reads strongest toward the upper right and fades leftward, with PatternPlacehold…

A full-height centered section whose primary dot grid is masked so the pattern is strongest toward the upper left and softens toward the right, including Patte…

A full-height centered section with a primary dot grid masked from the bottom-right corner so the pattern fades toward the opposite side, plus PatternPlacehold…

A full-height centered section with a primary dot grid vignetted from the middle so the edges fall away, centered PatternPlaceholder, and optional section clas…

A full-height centered section with a wide elliptical mask so the primary dot grid is strongest under the top edge and fades downward with a soft multi-stop fa…

A full-height centered section with a primary-tinted dot grid that fades upward from the bottom, using PatternPlaceholder as sample foreground content.

This component displays a visually engaging diagonal cross grid background pattern with fade effects, suitable for enhancing the visual appeal of any block. It…

This component renders a visually engaging background pattern featuring a left fade diagonal cross grid, suitable for enhancing the aesthetic appeal of any int…

This component serves as a full-screen background pattern block, featuring a diagonally oriented cross grid with a top fade effect. It allows customization thr…

This component creates a visually engaging background pattern with diagonal cross grids and a bottom fade effect, enhancing the aesthetic of any interface. It …

This component creates a visually appealing background pattern using diagonal cross grids and fade effects, ideal for enhancing the aesthetics of any user inte…

This component creates a visually appealing background pattern using a diagonal cross grid with a radial fade effect, set to fill a full-screen height layout. …

This component creates a visually engaging background pattern using diagonal cross grids and a center fade effect, perfect for dynamic and modern UX designs. I…

This component creates a full-screen container featuring a dashed grid background pattern, ideal for visually structuring content in an engaging way. It accept…

This component serves as a customizable background pattern block, featuring a radial gradient design with placeholder support. It allows users to apply additio…

This component creates a full-screen background pattern featuring a right-fade dashed grid effect, offering a distinctive and visually engaging backdrop for va…

This component renders a full-screen block with a dashed grid background pattern, featuring a gradient and masking effects for added visual depth. It is ideal …

This component creates a visually dynamic background pattern, featuring a dashed grid overlay with a top fade effect and a radial gradient. It serves as a vers…

The BackgroundPattern23 component creates a visually engaging block with a customizable background pattern featuring a dashed grid and radial gradient effects.…

This component creates a visually engaging background with a faded dashed grid pattern and supports custom styling through class names. It is ideal for adding …

This component generates a visually appealing background pattern with a bottom-left fade dashed grid effect, suitable for enhancing the design of user interfac…

This component creates a visually appealing background pattern using intersecting linear and radial gradients, ideal for adding texture and depth to any layout…

This component serves as a flexible background block that fills the entire viewport with a gradient and a placeholder pattern. It allows for customization thro…

This component, called BackgroundPattern28, is designed to display a customizable full-screen background pattern with a radial gradient effect that centers at …

This component renders a full-screen background pattern with a top radial glow effect, designed to enhance the visual appeal of any interface. It allows custom…

This component creates a full-screen flex container with a customizable linear grid background pattern suitable for visually enhancing layouts. It integrates a…

This component renders a full-screen background pattern with radial gradients, designed to enhance visual appeal. It provides a placeholder for additional patt…

This component renders a full-screen background featuring a circuit board pattern using CSS gradients, ideal for creating a visually engaging backdrop. It incl…

This component displays a visually appealing background pattern with a right-side fade resembling a circuit board, suitable for enhancing the aesthetics of a u…

This component is designed to create a visually engaging background with a circuit board pattern, featuring a left fade effect. It allows for customizable clas…

This component, named BackgroundPattern34, creates a visually appealing background pattern with a top fade circuit board effect suitable for full-screen displa…

This component is designed to display a full-screen background with a circuit board pattern, creating a visually engaging backdrop for other content. It includ…

A component that creates a visually interesting background pattern using a combination of linear gradients and radial masks, designed to mimic a circuit board …

This component is designed to showcase a full-screen background with a visually engaging circuit board pattern, featuring gradient lines and an elliptical mask…

This component creates a visually engaging background pattern with a center-fade circuit board design, ideal for adding dynamic aesthetics to full-screen secti…

The BackgroundPattern39 component creates a visually appealing section with a dynamic white grid and dots background, perfect for enhancing the aesthetics of a…

This component creates a full-screen background with a diagonal fade grid pattern using CSS gradients and masking techniques. It allows for additional styling …

This component serves as a versatile background pattern featuring a combination of linear and radial gradients, creating a grid with dots effect. It is designe…

This component creates a full-screen background pattern with a diagonal fade grid effect, ideal for enhancing the visual appeal of a user interface. It utilize…

This component renders a full-screen background pattern with a top fade grid effect, providing a visually appealing design element. It allows for custom stylin…

This component creates a visually dynamic background with a grid pattern and a radial fade effect, allowing users to apply customizable styles through the `cla…

This component, named BackgroundPattern8, is designed to create a visually appealing full-screen background with a fade grid pattern effect. It includes a cust…

This component, BackgroundPattern9, creates a visually appealing background with a grid pattern and a radial fade effect in the bottom right corner, which serv…

A full-height section with four chart-tinted radial glows on the page background plus a high-frequency conic noise overlay in blend mode, centered pattern plac…

A min-height screen section with stacked corner radial gradients from chart colors and a full-bleed SVG fractal noise layer at reduced opacity in overlay blend.

A full-height canvas with several large blurred radial gradients forming a mesh of chart colors, plus SVG fractal noise in overlay for grain, centered placehol…

A viewport-tall section with three stacked bottom-anchored radial glows in chart colors, heavy blur, SVG noise overlay, and centered pattern placeholder.

A min-height screen backdrop with two large blurred radial gradients from opposite corners using chart colors, SVG noise overlay, and centered pattern placehol…

A thin top bar with centered title, muted supporting text, an inline external link, and a ghost icon button that hides the banner.

A muted full-width bar with bold release title, supporting copy, and a ghost icon button that dismisses the banner.

A primary full-width banner with soft radial highlight, promotional copy, and a rounded secondary call-to-action button.

A bordered announcement bar with a live ticking countdown pill, muted offer copy, and an outline claim button with arrow.

A bordered status card with operational indicator, dashboard link, and a ghost dismiss action that hides the banner.

A slim bordered strip with sparkle icon, new badge, muted description, and an inline explore link with hover arrow motion.

An inverted full-width upgrade bar with mono eyebrow, product pitch, soft primary glow, and a secondary unlock button.

A card-surface banner with a short prompt, rounded email field, and subscribe button that swaps to a confirmation message.

A full-width promo strip with a tag icon, discount message, dashed mono code chip that copies on click, and a redeem button.

A card-surface banner with a sparkle icon, New badge, announcement line, overlapping avatars, and a see-what's-new link.

A muted banner inside the site container with inline title, description, link, and ghost close icon that removes the bar when clicked.

A muted full-width upgrade strip with a short title, supporting line, and a compact upgrade button aligned to the end.

A bordered horizontal marquee of short feature phrases separated by thin vertical dividers that loop continuously.

A slim brand bar with logo mark, product name, tagline, browse link, and a primary get-access link with arrow.

A dismissible maintenance warning strip with a chart-toned alert icon, schedule details, and a close control.

A card-surface progress banner with a package icon, remaining-count message, fraction readout, and primary progress bar.

A centered floating pill with a status dot, release message, and changelog link that nudges the arrow on hover.

A full-width webinar bar with a calendar date pill, title and session meta, plus an outline reserve button.

A full-width mobile promo bar with device icon, title and supporting line, plus App Store and Google Play links.

A solid primary strip with title and description beside a secondary shop-button link and icon, plus dismiss controls that move between mobile and desktop.

Full-width primary banner with title, supporting line, and dismiss icon; stacks on small screens and aligns on one row on wider viewports.

Absolutely positioned rounded banner with title, muted description, outline link button, and dismiss control that reflows from column to row on wider viewports.

Rounded floating banner with overlapping avatars, bold social-proof line, and a circular dismiss button beside the copy.

Dismissible full-width strip with message, vertical divider, learn-more link with arrow on desktop, and ghost close control.

A full-width primary strip with centered announcement copy and an underlined inline link that opens the catalog.

Two-by-two feature bento with avatar goal card, animated timing bar chart, overlapping dashboard imagery, and a collaboration widget panel.

Five-tile bento on a six-column grid combining cover photography, animated bar charts, and compact UI widget illustrations with varied aspect ratios.

Two-by-two bento placing headings above each tile visual, with grid-background icon flows, document UI mocks, and branded illustration panels.

Asymmetric eight-column bento with caption-below layout, mixing a document menu sidebar, wide dashboard panels, and compact icon illustrations on grid backgrou…

Four-tile dark bento for voice generation features with animated sound-wave fills, language selection UI, voice tuning controls, and instant generation preview.

Three-tile dark bento with emotion-based voice delivery UI, script-to-speech automation panel, and a full-width multi-format audio export preview.

Four-tile dark bento mixing two cover-image panels with script-enhancer and team-workspace UI mocks in an eight-column checkerboard grid.

Four-tile dark bento with a voice-preview image, brand-profile UI with count-up stats, multilingual model rows, and emotion tone picker controls.

Two-column bento with caption-below tiles mixing scroll-reveal photography and one animated predictive-analytics UI panel in a wide panoramic row.

Six-card masonry bento in three staggered columns with integration logo pills, animated charts, and compact AI feature UI illustrations in bordered cards.

Asymmetric two-column bento with count-up income stats, bar chart SVG, network beam diagram, and staggered project cards.

Three-tile bento leading with a split text-and-image hero card for recommendation intelligence, plus a wide data-analysis image and a budget-widget performance…

Neutral five-tile bento with animated waveform panel, AI model marquee, three webp visuals, and caption rows about health monitoring and compliance.

Black five-tile bento with dashed borders, two cover-image headers, and three animated dashboard cells for predictive analytics, task management, and recommend…

Black four-tile two-by-two bento where two cards place copy above the visual and two place it below, pairing webp panels with AI workflow captions.

Black four-tile bento in offset left and right stacks with alternating wide and tall aspect panels for sync, trends, decisions, and data visualization.

Black four-tile bento on an eight-five column rhythm with wide automation and dashboard headers above webp panels plus narrower benchmarking cells.

White two-by-two bento with animated UI previews above icon-labeled headlines on modular layouts, drag-and-drop styling, responsive auto-fit, and adaptive sizi…

White four-tile bento alternating headline placement with animated previews for theme switching, grid alignment, micro-interactions, and CTA emphasis blocks.

White two-by-two bento pairing animated UI previews with icon headlines on optimized assets, real-time editing, multi-content attachments, and brand typography.

White four-tile bento on a nine-seven column split with wide and narrow animated previews plus icon captions for modular grids, drag control, and responsive sc…

Two-column bento with count-up gauge, chart imagery, QR scanner animation, and hub network beams behind split headlines.

Muted healthcare bento stacking satisfaction percentage counters, framed UI panels, video consultation and health monitoring cards with HIPAA-focused copy.

Healora-themed bento mixing report generation and appointment scheduling cards, an indigo patient-stories panel with heart-rate animation, and timeline widgets.

Four-tile visual-only bento with gradient app-download CTA, automated savings mockup, and two square product panels on mixed pastel tile backgrounds.

Dense nine-cell bento on slate gray with upgrade discount pricing, animated barcode, mixed UI widgets, and a tall sidebar column of stacked panels.

Seven-tile legal-tech bento with background-check and forensics headers, AI legal assistance cards, cybercrime detection visuals, and stacked evidence panels.

Three-column dark bento for wireless audio with orange hero panels, lime waveform tiles, product photography, and a stacked color-swatch reference card.

Multi-row dark bento with amber hero typography over product photography, plus a mosaic of smaller branded panels in mixed aspect ratios.

Asymmetric dark bento with a tall left image column carrying outlined marquee text and a right stack of product photography and UI accent panels.

Two-column dark bento with tall portrait tile, stacked FASHIONS typography, color bands, and scroll-animated fashion imagery.

Multi-row gray-background bento mixing QR imagery, revenue bar chart, candlestick animation, gradient ring stat, and discount barcode card.

Black-background two-by-two bento mixing beam network SVG, static imagery, and an orange playhead scrubbing a bar chart.

Two-row black bento with voice feature cards, animated language keyboard, customization mockups, and fingerprint authentication panel.

Asymmetric black bento with productivity headline, product screenshot, automation workflow UI, social analytics chart, and right-column CTA panel.

Four equal dark cards in a two-by-two grid, each pairing a feature headline with an animated product UI mockup for assignment, prioritization, progress, and cl…

Asymmetric black bento with integration flow diagram, privacy messaging, counting performance stat, and floating globe illustration.

Three-row black bento with animated world map, collaboration card, integration icon row, and wide mobile mockup with CTA.

Asymmetric black bento mixing design-process timeline, API documentation visuals, stat counters, and a buy-sell trading panel with CTA.

Two-column black bento with AI chat mockup, scrolling integration marquee, reporting screenshot, and animated data connection paths.

Multi-span dark bento where each card pairs a headline with dashboard mockups, share UI, integration diagrams, and collaboration visuals.

White-background two-by-two bento with layered dashboard images, voice assistant mockup, and animated certificate cards.

Wide hero card with recommendation engine and radial chart above a two-column row of bar dashboard and share timer widgets.

Five-tile healthcare bento with animated health bars, scheduling imagery, interactive weight curve, wellness photo, and diagnostics visual.

Eight-column white bento mixing product screenshots, AI onboarding flow panels, and a gradient payment notification card.

Three-column light bento with revenue chart, AI learning graph, skeleton editor, screenshot, document stack, and anomaly heatmap tiles.

Tight two-row dark bento with voice waveform, performance chart, sales bars, auto-cycling progress tracker, and Kanban card stack.

Dark bento with scrolling service pill marquees, team invitation network, Solidity code block, crypto token ring, and tag cloud.

Four-column dark bento with newsletter counter, Gantt timeline, avatar collaboration rings, accounting panels, and animated world map.

Black-background six-column bento with four dashed-border tiles mixing animated SVG diagrams and scroll-reveal product imagery.

Neutral three-row bento pairing two feature cards with UI mini-mocks and a full-width model-selector panel with integration logos.

Four-card bento alternating animated document-flow and budget widgets with two photographic image tiles and scroll-triggered scale animations.

Five-tile black bento for chatbot features with animated message bubbles, encryption UI, voice imagery, and context-aware suggestion chips.

Large section heading, shadcn/ui Select filters, and a responsive grid of linked cards showing images, excerpts, and outline category badges.

Muted split layout with sticky intro column showing icon, Blog Posts heading, category links, and a two-column grid of tiles whose photos reveal on hover.

Centered outline badge intro, three bordered article cards with media, excerpts, author avatars, read-time badges, and an outline view-all button.

Centered Articles header with view-all link and a three-column grid of posts showing imagery, floating category badges, titles, calendar dates, and read-more l…

Centered section heading and subtitle, two-column featured article with media and badge, then a Popular Posts row of three compact stories with categories.

Blog list rows with team logo and name, date, linked headline, pill-shaped category links, Separator dividers, and an outline icon button on large screens.

Centered header with Badge and intro copy, then ghost Buttons filter categories beside a stacked feed of linked articles with Separator breaks between items.

Related articles heading beside a small outline Button, above a responsive grid of linked article stacks showing category, title, summary, and date.

Horizontal carousel of bordered image cards with topic and date badges, prev or next icon Buttons, gradient section backdrop, and a centered outline View All A…

Light section with heading row, outline Read More button, large featured image and headline with Avatar author row, plus a second column of square thumbnails b…

Narrow centered column with Badge, heading, description, then full-width stacked posts as image-led Cards with label, author, date, title link, summary, and ou…

Centered Badge-led header over a max-width feed where each post Card pairs a fixed-width thumbnail link with label, author, date, title, summary, and Read more…

Large Blog wordmark beside tagline and bordered author chip, then two columns with AspectRatio image and lead story stack opposite a Latest list of linked titl…

Top band with dotted muted background, Breadcrumb, headline copy, and spotlight Card, then All Blogs with horizontal RadioGroup filters, three-column Card grid…

Centered page title above a responsive grid where the first article spans extra rows and columns with image, metadata row, headline, and excerpt while smaller …

A blog index with a page title, stacked post rows showing date, title, excerpt, tag badges, and a circular arrow button, with separators between entries.

A blog section with a page header and a responsive grid of labeled posts with images, summaries, and author lines.

A blog section with a bold page heading and repeating two-column rows pairing a square image with title, uppercase date, excerpt, and a ghost Read control with…

This component dynamically displays a collection of blog posts with interactive animations and includes a prominent header for an engaging introduction. It all…

A blog listing with a section heading and responsive two-column grid of linked posts with images, category labels, and publish dates.

A centered blog grid of eight compact cards in four columns, each with a category badge, rounded thumbnail, title, summary, and read time.

A centered heading above a four-column grid of bordered cards with rounded thumbnails, category badges, author lines, and read links.

Centered section intro over full-width rows that alternate image-left and image-right layouts, separated by horizontal dividers with badge metadata and read li…

Badge-led intro above a feed where each row pairs metadata, copy, a square thumbnail, and a continue-reading link in a horizontal layout.

Two-column split with sticky category buttons in a left sidebar and a right feed of horizontal thumbnail rows that update when visitors change the active filte…

Section heading with outline action, split featured story with wide image and copy, then a three-column row of linked cards with category badges and metadata.

Uppercase section label above a two-column magazine split with a large left feature and a right stack of thumbnail mini posts separated by dividers.

A blog grid with section heading, intro line, card links showing images, category badges, author avatars, and a full-width view-all button on small screens onl…

Featured article in a two-column row with cover image beside category badge, headline, excerpt, author metadata, and read link inside one linked bordered card.

Section heading with left/right arrow controls above a horizontal Shadcn UI Carousel that shows three bordered blog cards at a time on desktop.

Section intro in a container above a full-bleed horizontal carousel of bordered story cards with cover image, category badge, headline, excerpt, date, and clic…

Two-column layout with sticky intro copy, outline tagline, primary CTA, arrow controls on the left, and a linked blog card carousel on the right.

Vertical timeline feed with a left rail, category labels, linked titles, and excerpt lines for each post.

Text-only blog index with bordered row dividers, right-aligned dates, and linked titles that underline on hover.

Newsletter signup header with email field and subscribe button above a two-column grid of linked photo cards with category, date, title, and excerpt.

Section label, heading, and all-posts link above a three-column grid of linked cards with cover images, categories, excerpts, dates, and read times.

Uppercase label and heading above a stacked list of linked posts with category, title, read time, date, and a trailing arrow.

Heading above a wide featured article card beside two stacked side cards, each with cover image, category, title, date, and read time.

A blog grid with the same card pattern as compact listings but mapping many posts, each with cover, badge, title, summary, avatar byline, and a mobile-only vie…

Magazine heading above a three-column bento of large photo cards and compact text cards with category badges, dates, and hover arrows.

Category filter buttons above a three-column grid of photo cards with excerpts, dates, and read times, plus an empty state and all-articles link.

Wide featured story with author byline and read time above a four-column grid of compact photo cards with category, title, date, and read time.

Muted-background section with a wide featured article and a three-column row of supporting photo cards, plus an all-posts link.

Two-column grid of linked article cards with cover images, excerpts, author avatars with roles, and read times.

Divided two-column rows that alternate cover image side, with category, title, excerpt, date, read time, and a read link.

Two-column layout with an email subscribe card beside a divided list of latest posts showing category, title, read time, and date.

Archive heading with article counts grouped by year, each year listing linked titles, categories, short dates, and a trailing arrow.

A blog grid with page title, subtitle, card links that lead with author and date, then title and summary, plus a mobile-only view-all button.

Three-column photo cards with a category overlay, hover arrow, excerpt, author name, read time, and date.

Two-column featured story with a cover image and category badge beside a long title, two supporting paragraphs, author byline, and read button.

Three-column resource grid with type chips, titles, descriptions, author avatars, and read times, plus a browse-all action.

Featured split story with cover, badge, excerpt, author, and read action above a four-column grid of supporting posts with authors.