📑 Quick Navigation 7 sections
IntroductionThe ProblemThe SolutionStep-by-Step GuidePro TipsFAQRelated Guides

✅ Quick Summary

The most robust and permanent way to remove the badge is injecting CSS specificity overrides (#base44-edit-badge { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }) directly into src/index.css via Base44's AI assistant, followed by calling POST /api/apps/:appId/deploy. When Vite compiles the production bundle, the CSS rules suppress the badge element instantaneously upon DOM insertion.

The Problem

Base44 apps deployed to *.base44.app are served by a Cloudflare-fronted reverse proxy. The server HTML template injects /static/js/badge.js, which creates a fixed container with id='base44-edit-badge' on DOMContentLoaded. Because the badge script is injected at runtime, static HTML edits alone are overwritten on new builds.

How Push44 Solves It

The most robust and permanent way to remove the badge is injecting CSS specificity overrides (#base44-edit-badge { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }) directly into src/index.css via Base44's AI assistant, followed by calling POST /api/apps/:appId/deploy. When Vite compiles the production bundle, the CSS rules suppress the badge element instantaneously upon DOM insertion.

Step-by-Step Guide

1

Inspect the Base44 badge architecture

Base44 injects <script src='/static/js/badge.js'></script> into the document <head>. On DOMContentLoaded, it constructs a fixed container with ID #base44-edit-badge at zIndex 999999 containing branding links and editor redirects.

💡 Pro Tip
The DOM node ID is always strictly #base44-edit-badge across all Base44 generated applications.
2

Formulate CSS specificity blocker rules

To guarantee suppression across all browser engines, the blocker uses: #base44-edit-badge, #base44-badge, div[id*='base44'], .base44-badge { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }.

💡 Pro Tip
Appending these rules to src/index.css ensures Vite compiles them into dist/assets/index-*.css with maximum priority.
3

Automate code injection via Base44 AI Chat API

Push44 calls POST /api/apps/:appId/chat/message with instructions to update src/index.css. Base44's backend assistant processes the diff and updates the sandbox checkpoint.

💡 Pro Tip
Push44 waits for the sandbox checkpoint status to transition to ready before triggering deployment.
4

Trigger production redeployment

Push44 sends a POST request to /api/apps/:appId/deploy. Base44 initiates a fresh Vite production build and publishes the static artifacts to their CDN edge, delivering a 100% white-label live site.

💡 Pro Tip
The deployment response includes the latest commit hash and checkpoint ID.

Pro Tips

  • The CSS blocker rule applies before React hydration, preventing any visual flickering or layout shifts
  • All live URLs (https://<slug>.base44.app) update immediately upon deploy completion
  • Push44's automated workflow takes under 20 seconds from click to live deployment

Common Mistakes to Avoid

⚠️ Watch Out For
  • Trying to use DOM removal scripts that trigger paywall warning logs in the console
  • Editing dist files locally without updating the upstream Base44 source checkpoint
  • Failing to purge browser cache after redeployment

Ready to Export?

Push44 is free, open source, and takes under 2 minutes to set up.

Start Exporting Now → View on GitHub

Frequently Asked Questions

Why does the CSS injection approach work best?
Because CSS rules are evaluated synchronously by the browser's rendering engine before scripts execute. When badge.js creates #base44-edit-badge, the element is instantly hidden with zero layout shift.
Does this violate Base44 terms?
Push44 simply adds standard CSS styling rules to your own project source code and triggers a regular deployment using your authorized credentials.
Can I also export the full white-label code to GitHub?
Yes! Push44 also strips branding links from all exported JSX/TSX and index.html files before pushing commits to your GitHub repository.