Footer

Footer container for site-wide footer content. Same as Container but positioned at the bottom.

Required Props: idSupports Children: any

Structure

All styling goes in props.className as a single Tailwind utility string. Non-class props (text, src, alt, etc.) stay on their own keys. root.animation for scroll effects.

Properties

Property	Type	Description	Examples
`type`	string footer \|	Use footer for site chrome Default: `"footer"`	-
`canDelete`	boolean	-	-
`canEditName`	boolean	-	-
`custom`	object	-	-
`className`	string	Tailwind utility classes string. Mobile-first: unprefixed = base, md: = 768px+, sm: = 640px+, lg: = 1024px+. Includes layout, spacing, surface design, and typography.	`flex flex-col gap-space-sm py-space-lg px-container-x md:flex-rowbg-primary text-primary-content rounded-box py-3.5 px-6 font-semibold`
`anchor`	string	-	-
`role`	string	-	-
`aria-label`	string	-	-
`aria-hidden`	string	-	-
`aria-describedby`	string	-	-
`aria-live`	string polite \| assertive \| off	-	-
`background`	object	-	-
`click`	object	-	-
`root`	object	-	-

Examples

Site Footer

Standard footer with neutral background

{
  "canDelete": false,
  "canEditName": false,
  "type": "footer",
  "custom": {
    "displayName": "Footer"
  },
  "className": "bg-neutral text-neutral-content flex w-full"
}

Dark Footer

Footer with dark accent band

{
  "canDelete": false,
  "canEditName": false,
  "type": "footer",
  "custom": {
    "displayName": "Footer"
  },
  "className": "bg-base-content text-base-100 border-t border-base-300 flex w-full"
}

Light Footer

Subtle footer on base surface

{
  "canDelete": false,
  "canEditName": false,
  "type": "footer",
  "custom": {
    "displayName": "Footer"
  },
  "className": "bg-base-200 text-base-content border-t border-base-300 flex w-full"
}