Brutal Blocks

Tag: Layout

  • Brutal Timeline Block: The Most Beautiful Storytelling Layout for Gutenberg

    Whether you are showcasing your company’s history, building a product roadmap, or designing a step-by-step tutorial, boring bullet points just don’t cut it. The Brutal Timeline Block is a beautifully engineered, fiercely responsive timeline builder that turns your chronological data into an absolute visual masterpiece directly inside the WordPress editor.

    We didn’t just build a timeline; we built a cinematic experience. It is flawlessly designed, incredibly lightweight, and perfectly inherits your theme’s style while giving you total control over the layout.

    🔥 What makes it brutal?

    • Dual Orientations: Choose between a classic Vertical scrolling timeline or a stunning, modern Horizontal layout to perfectly fit your page design.
    • Cinematic Animations: Make your timeline come alive as users scroll. Choose from premium entrance effects like Blur Reveal (cinematic), Fade + Rise, Slide In (Alternating), or Scale Pop.
    • Stagger Delay Control: Fine-tune the exact millisecond delay between each item appearing on screen to create a mesmerizing, cascading visual effect.
    • Custom Data & Icons: Each timeline node gives you total control. Add a Date/Label, a striking Title, and a detailed Description. Plus, enable “Custom Icons” to assign a unique, zero-bloat SVG to every single step of the journey.
    • Perfect Branding: Use the built-in color picker to easily set the Accent Color of the timeline track and nodes so it matches your brand identity flawlessly.

    Event

    An event

    Whatever

    Description

    Another event

    Another description

    💸 FREE vs. PRO

    The Free version is a gorgeous way to display a short, static list. But if you want to tell a real story and drop your visitors’ jaws with motion design, the PRO version is exactly what you need.

    • FREE Version: Extremely sleek, but you are locked to the Vertical orientation only, with a maximum of 5 timeline items. You can change the Accent Color and toggle the Date/Labels, but you get no animations and no custom icons.
    • PRO Version (Unleash the Beast): The ultimate storytelling tool.
      • Unlimited Items: Build massive, multi-year company histories or complex roadmaps.
      • Horizontal Layout: Unlock the beautiful, modern horizontal timeline orientation.
      • Cinematic Animations & Stagger: Access the premium motion effects (Blur Reveal, Slide In, etc.) and control the cascade speed with the Stagger Delay slider.
      • Custom Icons: Unlock the ability to assign specific, lightweight SVGs to every single node on your timeline with our icon picker.

    🛠️ Quick Help: Up and running in seconds

    Crafting a stunning timeline takes no time at all:

    1. Click on the + icon in your editor and type “Brutal”, then click on Browse All. Alternatively, click the + icon on the top left corner of the editor screen, scroll down to the Brutal Blocks section (or type “brutal” in the search field), and drag and drop the “Brutal Timeline” block onto your canvas.
    2. Click on the default timeline items to add your Date/Label, Title, and Description. Need more? Just add a new item block inside!
    3. Free users: Use the right sidebar to change your Accent Color. You can add up to 5 items in vertical mode, directly in the canvas.
    4. PRO users: Head to the Global Settings in the sidebar. Switch the Orientation to Horizontal if it fits your design, and toggle “Enable custom icons” to assign unique SVGs to each step.
    5. PRO users: Finally, select a premium Animation (like the cinematic Blur Reveal) and adjust the Stagger Delay slider. Save your page and enjoy the show.

  • Brutal Tabs Block: The Ultimate Fluid Content Organizer

    When you have a massive amount of information to share—like technical product specs, pricing details, or dashboard panels—forcing users to endlessly scroll is a UX nightmare. The Brutal Tabs Block is the ultimate Gutenberg tabs plugin. It allows you to elegantly pack complex layouts into a clean, compact, and highly organized interface.

    Forget about broken layouts on small screens. We engineered these tabs to be flawlessly responsive. If the screen or sidebar gets too narrow, the tabs smartly transform into a sleek horizontal scrolling list. Zero layout breaks, perfect mobile experience.

    🔥 What makes it brutal?

    • Drop Anything Inside: Built with native Gutenberg InnerBlocks. This means your tab content is not limited to boring text. Drop in image galleries, videos, forms, or even other Brutal Blocks directly into the editor.
    • Flawless Mobile UX: Impeccable horizontal scrolling for the tab navigation on narrow mobile screens.
    • Total Design Control: Use the intuitive color pickers to customize the background and text colors of both your active tabs and your content panels. Make it seamlessly match your brand.
    • Zero-Bloat Icons: Make your tab navigation visually striking by injecting lightweight Lucide SVG icons right next to your tab titles (complete with our custom Fill toggle).
    • Premium Animations: Bring your content to life. Add silky-smooth entrance animations (Fade In, Slide Up) every time a user clicks a new tab.

    tab #1

    💸 FREE vs. PRO

    The Free version is great for a basic breakdown, but if you are building complex pages, you will hit the ceiling fast. The PRO version unlocks the true power of dynamic content organization.

    • FREE Version: A solid starting point. You get full control over the colors to match your theme, and you can drop any block inside the content area. However, you are strictly limited to a maximum of 3 tabs. Plus, you are locked out of all icons and animations.
    • PRO Version (Unleash the Beast): The ultimate organizational tool.
      • Unlimited Tabs: Build massive, comprehensive tabbed interfaces without any restrictions.
      • Zero-Bloat SVG Icons: Access the 1,600+ custom Lucide icon-picker to make your tab titles instantly recognizable.
      • Advanced Animations: Make your content transitions feel expensive with premium Fade In and Slide Up effects.

    🛠️ Quick Help: Up and running in seconds

    Organizing your dense content takes just a few clicks:

    1. Click on the + icon in your editor and type “Brutal”, then click on Browse All. Alternatively, click the + icon on the top left corner of the editor screen, scroll down to the Brutal Blocks section (or type “brutal” in the search field), and drag and drop the “Brutal Tabs” block onto your canvas.
    2. Click directly on the tab navigation to type your titles.
    3. Drag and drop absolutely any WordPress block into the content area below the tabs.
    4. Free users: Use the right sidebar to tweak the background and text colors. You are allowed up to 3 tabs.
    5. PRO users: Add unlimited tabs. Use the icon-picker to add SVGs to your tab titles, and turn on the Fade In or Slide Up animations for a premium feel. Save and watch your layout transform.

  • Brutal Pricing Tables Block: High-Converting Gutenberg Pricing Grids

    Your pricing section is the most critical part of your website. It is where visitors decide to become paying customers. You cannot afford to use clunky, slow, or ugly layouts. The Brutal Pricing Tables block gives you a highly optimized, beautifully responsive canvas to showcase your plans and drive conversions directly inside the Gutenberg editor.

    Forget about spending hours tweaking colors. This block smartly inherits your theme’s default color palette, ensuring your pricing tables look like a native, seamless part of your brand from the very first second.

    🔥 What makes it brutal?

    • Monthly/Yearly Switcher: Instantly boost your cash flow. Add a sleek toggle to let users switch between monthly and annual pricing plans with a single click.
    • Highlight Your Best Plan: Push your visitors toward your most profitable package. Use the “Highlight” toggle to visually pop a specific column and make it the obvious choice.
    • Custom Badges: Add eye-catching ribbons or text badges (like “Most Popular” or “Best Value”) to draw immediate attention.
    • Zero-Bloat Bullet Icons: Ditch the boring default bullet points. We integrated our blazing-fast Lucide SVG icon-picker so you can add custom, lightweight icons to every single feature on your list.

    Basic

    $19/mo
    • Premium Support
    • Unlimited Bandwidth
    Get Started

    Pro

    $19/mo
    • Premium Support
    • Unlimited Bandwidth
    Get Started

    Enterprise

    $19/mo
    • Premium Support
    • Unlimited Bandwidth
    Get Started

    💸 FREE vs. PRO

    The Free version is great for a basic freelance site, but if you are running a SaaS, an agency, or a serious business, you need the conversion tools locked inside the PRO version.

    • FREE Version: Gives you up to 3 pricing columns. You can set your button URLs and use the Highlight toggle to make one plan stand out. However, you are completely locked out of list icons, custom badges, and the monthly/yearly toggle.
    • PRO Version (Unleash the Beast): The ultimate sales engine.
      • Unlimited Columns: Need to display 4, 5, or more plans? You got it.
      • The Monthly/Yearly Toggle: Unlock the interactive pricing switcher to upsell annual subscriptions.
      • Custom SVGs for Features: Access our 1,600+ zero-bloat SVG icon-picker to create beautiful, custom bullet lists that clearly communicate value.
      • Custom Badges: Add text ribbons to highlight your highest-converting plans.

    🛠️ Quick Help: Up and running in seconds

    Building a professional pricing section is incredibly straightforward:

    1. Click on the + icon in your editor and type “Brutal”, then click on Browse All. Alternatively, click the + icon on the top left corner of the editor screen, scroll down to the Brutal Blocks section (or type “brutal” in the search field), and drop the “Brutal Pricing Tables” block onto your layout.
    2. Free users: Start filling in your plan names, prices, and features (max 3 columns) directly in the canvas. Turn on the Highlight toggle on your preferred plan and add your Button URLs.
    3. PRO users: Head to the right sidebar to activate the Monthly/Yearly toggle. Set your dual prices directly in the canvas.
    4. PRO users: Add Custom Badges to your columns and use the icon-picker to replace standard bullet points with optimized SVG icons.
    5. Save your page and watch your conversion rates climb.

  • Brutal Bento Grid: The Trendiest Manual Layout for WordPress

    Bento grids are the hottest design trend right now (popularized by Apple and modern SaaS dashboards). But building them from scratch is an absolute nightmare. The Brutal Bento Grid block gives you a highly flexible, visual canvas to craft stunning “bento box” layouts directly inside the Gutenberg editor.

    Unlike our Dynamic version, this manual WordPress bento grid block is built for curation. It is the perfect tool to showcase your social media highlights, external links, portfolio pieces, or favorite resources exactly how you want them.

    🔥 What makes it brutal?

    • Pixel-Perfect Curation: You are in total control. Each cell allows you to manually set a gorgeous background image, add your custom title/content, slap on a sleek category badge, and link it anywhere you want.
    • Customize the Vibe: Keep it sharp with square edges or toggle the rounded corners on to give it that authentic, modern app feel.
    • Flawlessly Responsive: Forget about broken layouts. It looks incredibly premium on desktop monitors and smartly adapts to mobile screens and sidebars by stacking the cards cleanly one on top of the other.
    homepage

    Plugin

    SolGate Pro

    PLUGIN

    SolMint Pro

    💸 FREE vs. PRO

    The Free version is a great taste of the bento trend, but to build a real layout, you’ll need the firepower of the PRO version.

    • FREE Version: Perfect for a quick teaser. It limits you to a maximum of 3 cards per grid.
    • PRO Version (Unleash the Beast): Unlocks the true bento experience. Build stunning asymmetrical layouts with up to 12 cards. Got more to show? Push it beyond 12 cards, and the block automatically scales into a beautifully clean, classic grid layout.

    🛠️ Quick Help: Up and running in seconds

    Crafting a trendy manual bento layout is incredibly satisfying. Here is how:

    1. Click on the + icon in your editor and type “Brutal”, then click on Browse All. Alternatively, click the + icon on the top left corner of the editor screen, scroll down to the Brutal Blocks section (or type “brutal” in the search field), and drag and drop the “Brutal Bento Grid” onto your layout.
    2. Simply add cards by clicking + on the editor (up to 3 in Free, unlimited in PRO -a classic grid will apply with 12+ cards).
    3. Click on each individual cell to manually add your background image, write your title/content, set your badge, and paste your destination link.
    4. Toggle the rounded corners on or off in the block settings to match your style.
    5. Save your page and watch your custom layout shine.

  • Brutal Bento Dynamic Grid: The Auto-Pilot Layout for WordPress(PRO Exclusive)

    Stop wasting time manually updating your homepage grids every time you publish a new article. The Brutal Bento Dynamic Grid automatically fetches your latest posts or pages and injects them into a perfectly calculated, highly responsive “bento box” layout.

    If you are looking for the most beautiful and effortless Gutenberg dynamic grid, this is it. It handles the math, the image sizing, and the responsive breakpoints for you. Powered entirely by modern CSS Grid and PHP server-side rendering, it uses ZERO frontend JavaScript. It loads instantly, protects your Core Web Vitals, and looks incredibly sleek.

    ⚡ The “Set It and Forget It” Powerhouse

    This block is built specifically for power users, agencies, and busy publishers who want a premium aesthetic without the manual labor.

    • Stunning Visuals on Auto-Pilot: Each grid cell automatically grabs the post’s featured image as a gorgeous background, overlaying the exact title and a sleek category badge. It looks premium out of the box.
    • Smart Auto-Mapping (Max 12): Choose from 1 to 12 items, and the grid automatically recalculates its asymmetrical bento layout. Need to show more? Push it up to 24 cards, and it seamlessly transforms into a beautifully clean, classic post grid.
    • Insanely Responsive: It looks spectacular on large desktop monitors. On mobile screens or narrow sidebars, the grid smartly adapts, stacking the blocks cleanly one on top of the other.
    • Category Filtering & Styling: Pinpoint exactly what content appears by filtering standard posts by Category. Plus, you can toggle rounded corners on or off to perfectly match your site’s vibe.

    🛠️ Quick Help: Up and running in 3 clicks

    Setting up this auto-updating WordPress bento grid is ridiculousy easy:

    1. Click on the + icon in your editor and type “Brutal”, then click on Browse All. Alternatively, click the + icon on the top left corner of the editor screen, scroll down to the Brutal Blocks section (or type “brutal” in the search field), and drop the “Bento Dynamic (PRO)” block onto your layout.
    2. Head to the right sidebar settings. Select your source (Posts or Pages) and filter by Category if you want to narrow things down.
    3. Choose how many items to show (up to 12 for the dynamic Bento layout, or up to 24 for a classic grid).
    4. Toggle the rounded corners on or off.
    5. Save your page. The block will automatically pull your latest content, titles, badges, and featured images forever.

×

Wallet not authorized.