Skip to content

feat: Add backdrop-filter support for Android - #59141

Open
marcinszalski-callstack wants to merge 1 commit into
react:mainfrom
marcinszalski-callstack:feat/css_backdrop_filter_android
Open

marcinszalski-callstack wants to merge 1 commit into
react:mainfrom
marcinszalski-callstack:feat/css_backdrop_filter_android

Conversation

@marcinszalski-callstack

@marcinszalski-callstack marcinszalski-callstack commented Oct 16, 2026 •

Copy link
Copy Markdown

Summary:

This PR adds JS support for the backdrop-filter style property. It follows the CSS Filters spec as applied to backdrop rendering. The property accepts the same FilterFunction type already used by the filter property, so no new types are introduced — the existing array and string parsing via processFilter is reused directly.

Supported filter functions: blur, brightness, contrast, grayscale, sepia, saturate, invert, hue-rotate, drop-shadow.

Note: opacity() and drop-shadow() are parsed and accepted without error, but are effectively no-ops in a backdrop-filter context — opacity() reveals the unfiltered content beneath, and drop-shadow() operates on the rectangular backdrop image rather than content-shaped output, producing no visible result. This matches expected CSS spec behavior.

Work has been split into three PRs for more convenient reviewing. This part adds Android support.

Changelog:

[ANDROID] [ADDED] - Add backdrop-filter CSS support for Android

Test Plan:

Merge the JS and iOS PRs and run the RNTester app.

  • Test the Backdrop Filter screen in RNTester (BackdropFilterExample.js)
bf_merged2

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Oct 16, 2026
@facebook-github-tools facebook-github-tools Bot added the Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. label Oct 16, 2026

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant