expo-blur

A component that renders a native blur view on iOS and falls back to a semi-transparent view on Android. A common usage of this is for navigation bars, tab bars, and modals.

API documentation

• Documentation for the latest stable release
• Documentation for the main branch

Installation in managed Expo projects

For managed Expo projects, please follow the installation instructions in the API documentation for the latest stable release.

Installation in bare React Native projects

For bare React Native projects, you must ensure that you have installed and configured the expo package before continuing.

Add the package to your npm dependencies

npx expo install expo-blur

Configure for Android

[!note] This package only supports iOS. On Android, a plain View with a translucent background will be rendered.

Configure for iOS

Run npx pod-install after installing the npm package.

Contributing

Contributions are very welcome! Please refer to guidelines described in the contributing guide.

Similar packages

Other packages similar to expo-blur

react-native-blur

The react-native-blur package provides similar functionality to expo-blur, allowing developers to add blur effects to their React Native applications. It offers more customization options and is not tied to the Expo ecosystem, making it suitable for projects that do not use Expo.

react-native-blurhash

The react-native-blurhash package is used for generating and displaying blurred images using the BlurHash algorithm. While it focuses on a different aspect of blurring (image placeholders), it can be used in conjunction with expo-blur for comprehensive blur effects in an app.