Name: BricksFly – Bricks Builder Addons, Bricks Templates, Elements & GSAP Animations
Availability: InStock
Author: Wealcoder

45+ Elements and Extensions, GSAP animations, and ready-made website templates for Bricks Builder, no coding required.

BricksFly – Bricks Builder Addons, Bricks Templates, Elements & GSAP Animations

<p>BricksFly is a collection of Bricks Builder addons designed to extend your website-building workflow with Bricks Elements, useful Extensions, and a no-code GSAP animation engine. It helps designers and developers build interactive, animated websites in Bricks Builder without writing custom JavaScript.</p>
<p>BricksFly also provides ready-made Bricks templates and professionally designed templates for Bricks Builder through BricksFly Pro. These include complete starter websites and reusable sections for Bricks that can be imported and customized directly inside the Bricks editor. It is made by the team behind Animation Addons, a GSAP animation toolkit for WordPress.</p>
<p>Main features:</p>
<ul>
<li>45+ Bricks Elements and Extensions, including practical elements for Bricks and addons for Bricks Builder covering content, video, marketing, dynamic layouts, and workflow tools. Some are part of BricksFly Pro.</li>
<li>A no-code GSAP animation engine for Bricks Builder with ScrollTrigger, SplitText, parallax, horizontal scroll, sticky and pin, smooth scroll, image reveal on hover, and cursor effects.</li>
<li>A built-in Template Library with 30+ full Bricks templates and 500+ premium sections for Bricks (BricksFly Pro).</li>
<li>Responsive controls, live previews, and selective asset loading.</li>
</ul>
<p>Enable only the Elements and Extensions you need on each site. Animation controls can also respect reduced-motion preferences.</p>
<p><strong>Useful links:</strong> <a href="https://test.bricksfly.com/" rel="nofollow ugc">Live demo</a> | <a href="https://bricksfly.com/docs/" rel="nofollow ugc">Documentation</a> | <a href="https://bricksfly.com/elements/" rel="nofollow ugc">All Elements</a> | <a href="https://bricksfly.com/starter-templates/" rel="nofollow ugc">Starter templates</a> | <a href="https://bricksfly.com/sections-templates/" rel="nofollow ugc">Sections</a> | <a href="https://bricksfly.com/faq/" rel="nofollow ugc">FAQ</a> | <a href="https://crowdyflow.ticksy.com/" rel="nofollow ugc">Support</a> | <a href="https://www.facebook.com/groups/bricksfly/" rel="nofollow ugc">Community</a></p>
<p>Watch a quick overview:</p>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/5wno9t4gR64?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>More tutorials and walkthroughs are on the <a href="https://www.youtube.com/@gobricksfly" rel="nofollow ugc">BricksFly YouTube channel</a>.</p>
<h3>Elements for Bricks Builder</h3>
<p>Design dynamic websites with a growing collection of Bricks Elements, from creative layouts to marketing blocks. These elements for Bricks are built to work directly inside the Bricks Builder workflow. Just drag, drop, and customize. See them all on the <a href="https://bricksfly.com/elements/" rel="nofollow ugc">Elements page</a>.</p>
<h4>General Elements</h4>
<ul>
<li><strong>Advanced Button Pro</strong>: Create customizable Bricks buttons with modern hover styles and animations.</li>
<li><strong>Social Icons</strong>: Display social media icons with custom styles and hover effects.</li>
<li><strong>Brand Slider</strong>: Show client or brand logos in a customizable, animated slider.</li>
<li><strong>Counter</strong>: Display animated number counters for statistics and milestones.</li>
<li><strong>Progress Bar</strong>: Show progress indicators in multiple animated styles.</li>
<li><strong>Gallery Progress</strong> (Pro): Display an image gallery with an animated progress indicator.</li>
<li><strong>Icon Box</strong>: Display icons with titles and descriptions in clean, flexible layouts.</li>
<li><strong>Testimonial</strong>: Showcase client reviews with customizable layouts.</li>
<li><strong>Classic Testimonial</strong>: Display testimonials in a clean, classic style.</li>
<li><strong>Modern Testimonial</strong>: Present testimonials with modern, animated layouts.</li>
<li><strong>Team</strong>: Showcase your team members professionally with hover effects.</li>
<li><strong>Timeline</strong>: Tell your story with animated, scroll-triggered timeline layouts.</li>
<li><strong>Floating Elements</strong>: Add floating, rotating, zooming, and motion effects to any element.</li>
</ul>
<h4>Animation Elements</h4>
<ul>
<li><strong>Animated Heading</strong>: Create animated headings with multiple text effects and triggers.</li>
</ul>
<h4>Header &amp; Footer Elements</h4>
<ul>
<li><strong>Animated Off-Canvas</strong> (Pro): Create animated off-canvas panels for menus or custom content.</li>
</ul>
<h4>Dynamic Elements</h4>
<ul>
<li><strong>Social Share</strong> (Pro): Enable social sharing for any post or page.</li>
<li><strong>Post Meta</strong>: Show post metadata such as date, author, and category.</li>
<li><strong>Video Story</strong>: Present posts or content in an engaging video story format.</li>
</ul>
<h4>Video Elements</h4>
<ul>
<li><strong>Video Popup</strong> (Pro): Display videos inside a popup modal to boost engagement.</li>
<li><strong>Video Box</strong>: Embed external or self-hosted videos directly inside Bricks.</li>
<li><strong>Video Mask</strong>: Apply creative masks and visual effects to video elements.</li>
<li><strong>YouTube Video</strong> (Pro): Embed and customize YouTube videos with advanced controls.</li>
<li><strong>Scrollable Video</strong>: Play or scrub a video as the visitor scrolls the page.</li>
<li><strong>Video Box Slider</strong>: Display videos in a responsive slider layout.</li>
</ul>
<h4>Advanced Elements</h4>
<ul>
<li><strong>Image Accordion</strong>: Highlight images with smooth accordion-style interactions.</li>
<li><strong>Toggle Switch</strong>: Add interactive on and off toggle elements for content control.</li>
<li><strong>Draggable Items</strong>: Add drag-and-drop interactive items to a page.</li>
</ul>
<h3>Bricks Builder Addons and Extensions</h3>
<p>BricksFly includes a growing collection of Bricks Builder addons and Extensions that enhance your Bricks workflow. These extensions for Bricks add animation, interaction, navigation, and workflow features without requiring custom code. Enable only what you need to keep your site lightweight and fast. Some Extensions are part of BricksFly Pro.</p>
<h4>GSAP Extensions</h4>
<ul>
<li><strong>Scroll Smoother</strong>: Add smooth scrolling for a modern, fluid browsing experience.</li>
<li><strong>Animation</strong>: Create custom Bricks animations with flexible triggers and timing.</li>
<li><strong>Sticky/Pin Element</strong>: Keep sections or elements fixed during scrolling for sticky effects.</li>
<li><strong>Text Animation</strong>: Build dynamic SplitText animations including text reveal, fade, 3D text, and character-by-character effects.</li>
<li><strong>Image Animation</strong>: Apply dynamic motion effects to images for better visual engagement.</li>
<li><strong>Parallax Effect</strong>: Add creative parallax scrolling effects to any element or section.</li>
<li><strong>Effects</strong>: Apply ready-made motion effects to your Bricks elements.</li>
<li><strong>Cursor Hover Effect</strong>: Add interactive hover animations triggered by cursor movement.</li>
<li><strong>Image Reveal on Hover</strong>: Reveal images smoothly on hover for modern design layouts.</li>
<li><strong>Cursor Move Effect</strong>: Create motion effects that respond to user cursor movement.</li>
<li><strong>ScrollTrigger</strong>: Trigger advanced animations based on scroll position using GSAP ScrollTrigger.</li>
<li><strong>Horizontal</strong>: Build horizontal scroll animations using GSAP ScrollTrigger.</li>
<li><strong>ScrollTo</strong>: Create smooth scroll-to navigation for one-page Bricks websites.</li>
</ul>
<h4>General Extensions</h4>
<ul>
<li><strong>Tilt Effect</strong>: Create mouse-based tilt animations for interactive Bricks elements.</li>
<li><strong>Advanced Tooltip</strong>: Add rich, interactive tooltips to display extra information on hover.</li>
<li><strong>Wrapper Link</strong>: Make entire sections, containers, or blocks fully clickable without extra code.</li>
<li><strong>Preloader</strong>: Display custom preloader animations while your Bricks site loads.</li>
<li><strong>Cursor</strong>: Replace the default cursor with custom designs and interactive cursor styles.</li>
<li><strong>Scroll Indicator</strong>: Show a reading progress bar or scroll indicator on any page.</li>
<li><strong>Scroll To Top</strong>: Add a customizable scroll-to-top button for better navigation.</li>
</ul>
<p>Explore individual features: <a href="https://bricksfly.com/sticky-elements/" rel="nofollow ugc">Sticky and pin elements</a>, <a href="https://bricksfly.com/split-text-animation/" rel="nofollow ugc">Split text animation</a>, <a href="https://bricksfly.com/image-animation/" rel="nofollow ugc">Image animation</a>, <a href="https://bricksfly.com/image-reveal-on-hover/" rel="nofollow ugc">Image reveal on hover</a>, <a href="https://bricksfly.com/horizontal-scroll/" rel="nofollow ugc">Horizontal scroll</a>, <a href="https://bricksfly.com/cursor-hover-effect/" rel="nofollow ugc">Cursor hover effect</a>, and <a href="https://bricksfly.com/advanced-tooltip/" rel="nofollow ugc">Advanced tooltip</a>.</p>
<h3>GSAP Animation for Bricks Builder</h3>
<p>Create GSAP animation for Bricks Builder visually without writing custom JavaScript. Pick a trigger, set the options, and preview it live inside Bricks. BricksFly supports GSAP animations for Bricks including ScrollTrigger scroll animations, SplitText text reveals, parallax, horizontal scroll, sticky and pin sections, smooth scrolling, and cursor effects.</p>
<p>Watch a SplitText animation built in Bricks:</p>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/HHGyuIYFQbY?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<h3>Bricks Templates and Sections (BricksFly Pro)</h3>
<p>With BricksFly Pro, start from 30+ professionally designed Bricks templates and complete starter websites with inner pages. You also get 500+ reusable sections for Bricks to build landing pages, service pages, portfolios, pricing pages, and more.</p>
<p>These templates for Bricks Builder can be imported with one click from the built-in Template Library. Every design is editable inside Bricks and can be enhanced with BricksFly animations and Extensions. Browse the <a href="https://bricksfly.com/starter-templates/" rel="nofollow ugc">starter templates</a> and <a href="https://bricksfly.com/sections-templates/" rel="nofollow ugc">sections</a>, or try the <a href="https://test.bricksfly.com/" rel="nofollow ugc">live demo</a>.</p>
<p>Watch a full site imported in minutes:</p>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/pdOmNxijQCo?version=3&#038;rel=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;fs=1&#038;hl=en-US&#038;autohide=2&#038;wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<h3>Who BricksFly is for</h3>
<p>BricksFly fits freelancers who want to deliver more without subcontracting, agencies that need a repeatable production workflow, designers who want to own the final result, and business owners who want to manage their own site. Developers use it to skip repetitive setup and spend time on custom work. Learn more on the <a href="https://bricksfly.com/what-is-bricksfly/" rel="nofollow ugc">What is BricksFly</a> page.</p>
<h3>External Services</h3>
<p>BricksFly uses the Themecrowdy API to provide one-click import for Bricks templates, starter websites, and section templates inside the Bricks Builder workflow.</p>
<p>Our Mailchimp integration connects to Mailchimp’s API when you use the related subscription feature. Subscribing is optional, and no data is collected unless you choose to submit it.</p>
<p>Source Code:</p>
<p>See the BricksFly source code in our public repository: <a href="https://github.com/Wealcoder/bricksfly-elements-for-bricks" rel="nofollow ugc">GitHub Repository</a>.</p>


Alternative Plugins for

Discover the Lists with BricksFly – Bricks Builder Addons, Bricks Templates, Elements & GSAP Animations