Budibase/budibase · warning

File too large. 20mb limit

Error message

File too large. 20mb limit

What it means

The branding settings page registers a handleFileTooLarge callback on the File upload component for the logo image. When the selected file exceeds the component's 20MB max size, the File component invokes this callback instead of uploading, and the page shows a warning notification with this message. It is a client-side size guard, not a server rejection.

Source

Thrown at packages/builder/src/settings/pages/branding.svelte:228

<LockedFeature
  title={"Branding"}
  planType={"Premium"}
  description={"Add and manage branding for your account"}
  enabled={brandingEnabled}
  upgradeButtonClick={async () => {
    licensing.goToUpgradePage()
  }}
  showContentWhenDisabled
>
  {#if sdk.users.isAdmin($auth.user) && mounted}
    <Layout noPadding gap="S">
      <div class="branding fields">
        <div class="field">
          <Label size="L">Logo</Label>
          <File
            title="Upload image"
            handleFileTooLarge={() => {
              notifications.warn("File too large. 20mb limit")
            }}
            extensions={imageExtensions}
            previewUrl={logoPreview || logo?.url}
            on:change={e => {
              let clone = { ...config }
              if (e.detail) {
                logoFile = e.detail
                logoPreview = null
              } else {
                logoFile = null
                clone.logoUrl = ""
              }
              config = clone
            }}
            value={logoFile || logo}
            disabled={!brandingEnabled || saving}
            allowClear={true}
          />

View on GitHub (pinned to a81a902e9a)

Solutions

1. Compress or resize the image below 20MB before uploading (e.g. export as optimized PNG/WebP at display resolution).
2. Use an SVG for logos where possible — they are small and scale cleanly.
3. Run the image through a tool like ImageOptim, squoosh, or ImageMagick convert.

Example fix

// before: 25MB raw photo
convert logo.png -resize 1024x1024 -quality 85 logo-small.png
// after: upload the optimized file
// logo-small.png is well under the 20MB limit

const MAX = 20 * 1024 * 1024
if (file && file.size > MAX) {
  notifications.warn("File too large. 20mb limit")
  return
}

When it happens

Trigger: Selecting/dropping a logo image larger than 20MB in Settings > Branding, which fires the File component's file-too-large event and calls notifications.warn.

Common situations: Uploading high-resolution exported PNGs or unoptimized photography as a company logo; dragging a print-quality asset into the branding page.

Related errors

• Source table '${relationship.sourceTable}' not found in data
• Target table '${relationship.targetTable}' not found in data
• Invalid custom REST template
• automationId and appId are required
• Query ID or Revision is missing

AI-assisted analysis of Budibase/budibase@a81a902e9a (2026-08-29). Data as JSON: /api/errors/0e6e02fc80fd80d0. Report an issue: GitHub.