Waiting
Customize and export code (opens in a new tab)Compare designs
Each model builds its own version. Pick your favorite and customize it.
Desktop preview
See how each design looks on a full-width desktop screen. Mobile preview
Check how each design adapts to a small phone screen.
See how each design looks on a full-width desktop screen. Mobile preview
Check how each design adapts to a small phone screen.
How to create best blog components?
Provide representative articles. Include sample titles, excerpts, publication dates, authors, and image preferences. Explain whether you are highlighting one featured story or presenting a balanced collection of posts.
Describe the browsing experience. Ask for the metadata, category labels, and reading links your readers need. Specify the desired card density and how titles and images should align across the component.
Try realistic content lengths. Compare layouts using a long headline and an article without an image. Check that the reading order stays clear and that each post remains easy to open on mobile.
Examples of blog components
BoldUI
Full-bleed hero with featured article and three-card article grid
A full-width hero with a large background photo, date, headline, and yellow 'Read article' button, followed by a three-column grid of photo cards with dates and centered headlines on black overlay shapes. Used to present blog or news article teasers.
Uinel
Latest Blog Section with Featured and Stacked Article Cards
A blog listing section with a large featured article card on the left and two smaller stacked article cards on the right, each with a photo, category label, date, heading, and text. The featured card includes a blue Learn more button, and the page uses a light lavender background with a bold 'Latest blog' heading above the grid.
Metis
Blog Post Card Grid with Abstract Image Headers
A blog section titled "Our Blog" showing five post cards in a mixed grid, with one wide card and several square cards, each with abstract fluid-art images, category label, date, heading, and excerpt. A blue "Show all posts" button is centered below the grid.
Suncealand
Blog Post List with Left Sidebar Heading and Stacked Article Cards
A blog listing page with a left column containing a BLOG pill badge and large serif Blog heading, and a right column with stacked article entries, each showing a date, serif headline, photo, and Learn more link. The layout separates the page title from a vertical list of posts with generous whitespace.
Explore component generators
Generate any section of your website with the same multi-model workflow.
No categories match your search.
