Skip to main content

expo-brightness

Version: 55.0.6 Provides an API to get and set screen brightness.

Installation

npx expo install expo-brightness

Usage

import * as Brightness from 'expo-brightness';

// Get current brightness
const brightness = await Brightness.getBrightnessAsync();

// Set brightness (0-1)
await Brightness.setBrightnessAsync(0.8);

// Restore system brightness
await Brightness.restoreSystemBrightnessAsync();

API Reference

Methods

Brightness.getBrightnessAsync()
() => Promise<number>
Gets current screen brightness (0-1)
const brightness = await Brightness.getBrightnessAsync();
console.log(`Brightness: ${(brightness * 100).toFixed(0)}%`);
Brightness.setBrightnessAsync(brightness)
(brightness: number) => Promise<void>
Sets screen brightness (0-1)
// Set to 50%
await Brightness.setBrightnessAsync(0.5);

// Set to maximum
await Brightness.setBrightnessAsync(1.0);
Brightness.getSystemBrightnessAsync()
() => Promise<number>
Gets the system brightness setting
Brightness.setSystemBrightnessAsync(brightness)
(brightness: number) => Promise<void>
Android only: Sets system brightness permanently
Brightness.restoreSystemBrightnessAsync()
() => Promise<void>
Android only: Restores original system brightness
Brightness.useSystemBrightnessAsync()
() => Promise<void>
Android only: Uses system brightness setting
Brightness.isUsingSystemBrightnessAsync()
() => Promise<boolean>
Android only: Checks if using system brightness
Brightness.getSystemBrightnessModeAsync()
() => Promise<BrightnessMode>
Android only: Gets brightness mode (manual or automatic)
Brightness.setSystemBrightnessModeAsync(mode)
(mode: BrightnessMode) => Promise<void>
Android only: Sets brightness mode

Permissions

Brightness.requestPermissionsAsync()
() => Promise<PermissionResponse>
Requests brightness permissions
Brightness.getPermissionsAsync()
() => Promise<PermissionResponse>
Gets current permission status

Examples

Brightness Slider

import * as Brightness from 'expo-brightness';
import { useEffect, useState } from 'react';
import { View, Text, Slider } from 'react-native';

function BrightnessControl() {
  const [brightness, setBrightness] = useState(0.5);

  useEffect(() => {
    async function loadBrightness() {
      const current = await Brightness.getBrightnessAsync();
      setBrightness(current);
    }
    loadBrightness();
  }, []);

  const handleChange = async (value: number) => {
    setBrightness(value);
    await Brightness.setBrightnessAsync(value);
  };

  return (
    <View style={{ padding: 20 }}>
      <Text>Brightness: {(brightness * 100).toFixed(0)}%</Text>
      <Slider
        value={brightness}
        onValueChange={handleChange}
        minimumValue={0}
        maximumValue={1}
      />
    </View>
  );
}

Temporarily Boost Brightness

import * as Brightness from 'expo-brightness';

// Save original brightness
const originalBrightness = await Brightness.getBrightnessAsync();

// Boost to maximum
await Brightness.setBrightnessAsync(1.0);

// Do something that needs bright screen...

// Restore original
await Brightness.setBrightnessAsync(originalBrightness);

Platform Support

PlatformSupported
iOS
Android
Web

Resources