Skip to main content

Elements

74 templates in this category. Each page has the screenshots, the structure, what to change and the CSS variables.

  • Content · Vertical slider — Slides move up and down with the arrows, the dots or the keyboard.
  • Elements · 404 simple — A centered 404 page: a large 404 in the brand color, the page title (h1), a short text and two buttons.
  • Elements · Accordion — A showcase of the FBK Accordion component: lines, cards and a framed box; an accent line under the open title or a bar beside it; an arrow or a plus; numbers; two columns; and a dark background.
  • Elements · Accordion with photos — An accordion of cards with an icon before each title.
  • Elements · Alternate slider — Five framed photos per view: the center one widens and its caption rises; the next one sits higher and the previous one lower; the ones at the ends are half height.
  • Elements · Autoplay accordion — An accordion that opens its items one after the other.
  • Elements · Back to top — The FBK Back to top button in its three effects: Label, Fill and Rise, with the looks of the Fancy Bricks style families.
  • Elements · Buttons — A showcase of the FBK Button component: every style and hover effect on light, dark and brand backgrounds, plus sizes and options.
  • Elements · Caption carousel — A looping carousel of tall photos, two per view with a peek of the next; the active photo (the first one) shows its caption with an accent bar.
  • Elements · Card carousel — Tall photo cards loop over a dark photo panel; the active card is the largest.
  • Elements · Card effects — A showcase of the FBK Card grid component and its optional hover effects: lift, photo zoom, 3D tilt, border light and text reveal, light and dark, and of FBK Flip card.
  • Elements · Card navigation slider — A full-width photo with its text on the left and, on the right, a carousel of white cards that drives it: the active card becomes all photo.
  • Elements · Card navigation slider (text right) — A full-width photo with its text on the left, aligned towards the cards and, on the right, a carousel of white cards that drives it: the active card becomes all photo.
  • Elements · Center focus carousel — Text cards with a large faint icon, three per view: the center one is in focus, the ones beside it smaller and fainter, the far ones fading out past the edges.
  • Elements · Circle text — A showcase of the FBK Circle text component: text that goes round an icon, a photo or nothing, plain, with a ring or on a brand disc, as a link, turning always, on hover or still.
  • Elements · Cursor slider — One large photo per view.
  • Elements · Focus carousel — A split light and brand background with the intro and its button, and a centered carousel of cards set out as a staircase: previous low, active in the middle and larger, next high.
  • Elements · Forms — A showcase of the Fancy Bricks form styles on the Bricks Form element: boxed, underline, floating label, floating label with underline, phone with country code and a one-row newsletter, on light and dark.
  • Elements · Fullscreen slider — One large photo per view across the full width.
  • Elements · Headings — A showcase of the FBK Intro component: every title highlight, eyebrow style and accent line on light, dark and brand backgrounds.
  • Elements · Hero backgrounds — A showcase of the FBK Hero component (a hero stage: full-bleed background, layer, effects and the content in the page width) and of compact FBK Counter figures (a figure that counts up and its caption).
  • Elements · Horizontal accordion — A horizontal accordion of photos: each closed strip shows its name in a vertical pill; the open one grows and shows a white card with a text and a button.
  • Elements · Horizontal accordion, centered — A horizontal accordion of three photos with the center one open: a side strip opens when the mouse reaches it and the center one comes back when the mouse leaves.
  • Elements · Horizontal panels — A horizontal accordion of outlined strips with their titles written vertically; the open one turns to the accent color and shows a text and a button over its photo.
  • Elements · Horizontal scroll — The section stays pinned while the page scrolls and a row of project cards slides sideways; a bar shows how far along you are and cards light up as they arrive.
  • Elements · Itinerary accordion — A day-by-day itinerary as an accordion of cards, each title with its «Day» number, and a switch that opens or closes every day at once.
  • Elements · Link in bio — A «link in bio» page: a narrow column with a round photo, a name and one line, six links as full-width rows and the social links at the foot.
  • Elements · Link list — A showcase of the FBK Link list component (footer columns): layouts, hover effects, size and alignment, on light and dark.
  • Elements · List hover fill — A list of services: a big title, a line of text and an arrow per row; a dark band sweeps across the row under the mouse or with keyboard focus.
  • Elements · List hover photos — Numbered links on the left; under the mouse or with keyboard focus the title slides away for another phrase, an arrow appears and that row's photo slides into the panel on the right.
  • Elements · List hover words — Big words in thin frames, staggered, each with its number; under the mouse or with keyboard focus the word lights up and two photos slide out beside it.
  • Elements · List numbered — A photo and an intro above a grid of numbered links (three, two or one column by width); the number, the name and the line take the accent color under the mouse.
  • Elements · Marquee — A showcase of the FBK Marquee component: logos with dividers or in cards, text, text with an image, two columns of testimonials going up and down, and two strips in opposite directions on a dark background.
  • Elements · Marquee accordion — An accordion whose titles are moving strips: a big word and a photo in a pill, repeated.
  • Elements · Marquee wall — Columns of photos that move up and down in turn, tilted, in a rounded box under a title, with one pause button for all of them.
  • Elements · Marquee wall cover — A title, a line and two buttons centered over columns of photos that move up and down, tilted, under a dark layer that fills the whole section, as a hero; one pause button for all of them.
  • Elements · Marquee wall fade — Three tilted columns of photos that move up and down in turn and fade out in an oval, under a title.
  • Elements · Marquee wall isometric — Three columns of screenshots that move up and down in turn, turned and skewed like a tilted table, fading out at the edges.
  • Elements · Marquee wall straight — Two straight columns of photos that move up and down in turn, in a narrow wall.
  • Elements · Media text — The FBK Media text component in four set-ups (plain, panel, overlap, narrow media) and the FBK Mini card styles.
  • Elements · Navigation — A showcase of the FBK Nav component with a WordPress menu (submenus and sub-submenus): logo left, menu centered, logo centered and split layouts; underline, growing line, dot, pill, bubble, brackets, highlight and corner link effects, two submenu link effects; the menu opening as a card, a side panel or the full screen.
  • Elements · Orbit text — A word repeated in tilted rings that turn in 3D around a photo, in front of it and behind it, beside an intro; with a pause button.
  • Elements · Outlined form — A form where each label sits on the top border of its field: text, email, date, select, radio buttons, checkboxes, a message and files.
  • Elements · Overflow carousel — A centered intro and a carousel of cards that runs past both screen edges and plays on its own; under it, segments that fill as each card plays, a pause button and the arrows.
  • Elements · Pagination — A showcase of the Fancy Bricks pagination: five styles for the Bricks Pagination element (discs, ring, underline, dot, joined) and a Load more button, all paging real posts.
  • Elements · Phone carousel — A centered carousel of app screenshots, three per view.
  • Elements · Photo ring — A centered intro and, under it, a band of photos turning slowly around you, curved like the inside of a ring.
  • Elements · Photo ring (tilted) — A centered intro and, under it, a whole ring of photos turning slowly, leaning towards you.
  • Elements · Popover — Three FBK Popover buttons: each opens a small panel with a title, a text and buttons.
  • Elements · Portfolio carousel — A white panel with the intro, next to a carousel of tall website screenshots on a base-light background that runs to the screen edge.
  • Elements · Prime slider — On a dark background, the active slide is a large photo with tags, title, text and button; the next ones fold to half width and line up beside it.
  • Elements · Rotating heading — A heading with a teleprompter: right after the title's text a column of words scrolls up one row at a time, stops and goes on; the word in the middle lights up.
  • Elements · Section menu — A menu of icon-and-label links in a bar above four stacked blocks; it stays fixed on screen while the blocks scroll past, each link jumps to its block and the block in view marks its link.
  • Elements · Section menu (side) — A menu of icon-and-label links in a column on the left of four stacked blocks; it stays fixed on screen while the blocks scroll past, each link jumps to its block and the block in view marks its link.
  • Elements · Share buttons — The FBK Share component: links that share the current page on Facebook, X, LinkedIn, WhatsApp, Telegram, Pinterest, Bluesky and by email, in four styles and three sizes, with brand or network colors, names, a dropdown and a floating bar beside the article, on light and dark backgrounds.
  • Elements · Slot heading — A big word over a photo whose letters spin like slot-machine reels when it comes into view, bounce and stop at slightly different heights.
  • Elements · Social links and icon items — A showcase of two components: FBK Social (links to your social profiles in five styles) and FBK Icon item (an icon, a title and a short text: stacked, inline or boxed).
  • Elements · Split carousel — One wide slide per view with the neighbors peeking out under a brand-color cover.
  • Elements · Spotlight carousel — Four photos per view: the active one rises to full height with its button, and its large title and text sit beside it, above the thumbnails.
  • Elements · Staggered slider — A row of short thumbnails that ends in the active slide, full height, with its title and text beside it.
  • Elements · Sticky photos — Text blocks scroll past while a photo panel stays in view beside them and slides to the photo of the block in the middle of the screen.
  • Elements · Sticky photos, full height — Text blocks scroll past while a photo panel fills the right half of the screen, top to bottom, and slides to the photo of the block in the middle of the screen, as in the original.
  • Elements · Stories slider — A vertical story like a phone screen: bars that fill as each story plays, the author and time with a pause button, a photo that slowly comes closer, and a headline, text and button.
  • Elements · Style families — The Fancy Bricks style families: every small piece (buttons, social links, share links, icons, tags) in the same five looks (Plain, Soft, Outline, Solid, Elevated), two tones (Brand, Neutral), three shapes and three sizes, on light, dark and brand backgrounds.
  • Elements · Team member — A showcase of the FBK Team member component: card, minimal, overlay, horizontal and brand foot styles, centered text, photo shapes, an optional photo zoom and social links that come in on hover, on light and dark.
  • Elements · Thumbnail slider — A large photo with its title, text and button, driven by a strip of thumbnails that sits over the photo and a brand-color band with a big vertical word.
  • Elements · Timeline — A showcase of the FBK Timeline and FBK Timeline step components: vertical, alternate and horizontal layouts, dot, number and icon markers, plain steps or cards, a dashed line or one that fills while you scroll, on light and dark.
  • Tabs · Autoplay — Tabs with an icon that move on by themselves; the open one fills a progress bar while its time runs, and a pause button with a countdown ring sits under the list.
  • Tabs · Background — A full-screen section over a darkened photo.
  • Tabs · Media — Each tab pairs an image with a heading, a lead and a button.
  • Tabs · Numbered — A numbered list of large titles; a line slides to the active one, which opens a short text.
  • Tabs · Services — Four services as cards that work as tabs; the active card turns white with an accent line.
  • Tabs · Sidebar — The client area of a website: a sidebar with icon links that work as tabs, the user's profile and a log out link at the bottom, and a panel per section on the right (title, a sentence and two cards).
  • Tabs · Vertical — A large card: on the left a title, a vertical list of tabs with a chevron (one with a "New" label) and a button; on the right, the photo of the open tab.