Summary
Update `` to implement the PatternFly v6 Background image component.
Full-page background image with optional filter overlay, typically used behind login pages.
Prior Art
| Source |
Element |
Status |
| PFE v4 |
`` |
Exists |
| cem |
-- |
-- |
| cockpit |
-- |
-- |
| chickadee |
-- |
-- |
Requirements
- MUST implement PFv6 visual designs
- MUST provide end-user feature parity with `@patternfly/react-core` BackgroundImage
- MAY adjust element API to leverage web platform strengths
- SHOULD maintain CSS custom property theming compatibility
- SHOULD expose useful CSS shadow parts
Element-specific considerations
- React `src` accepts a single string URL or a `BackgroundImageSrc` object (`xs`, `xs2x`, `sm`, `sm2x`, `lg` breakpoints) for responsive images; decide whether to support both or just single URL via attribute
- React `filter` - CSS filter string applied as an overlay (e.g. blurred gradient); defaults to built-in SVG filter
- Element is purely decorative - must set `aria-hidden="true"`
- Injects an SVG `` element into the page; verify shadow DOM approach vs. light DOM injection
- No interactive behavior; no focusable children
Checklist
Rename
Implementation
Demos
Tests
Reviews
Ship
Summary
Update `` to implement the PatternFly v6 Background image component.
Full-page background image with optional filter overlay, typically used behind login pages.
Prior Art
Requirements
Element-specific considerations
Checklist
Rename
Implementation
Demos
Tests
Reviews
Ship