Own Your Device Geometry

The most
comprehensive
geometry library
for React Native.

git:(main)xnpm i react-native-device-geometry

0102030405060708091011121314151617

import { useDeviceGeometry } from 'react-native-device-geometry';
import { View, Text } from 'react-native';
export default function CutoutInfo() {
 const { cutouts, screenSize } = useDeviceGeometry();
 return (
 <View>
 <Text>Screen: {screenSize.width}x{screenSize.height}px</Text>
 {cutouts.top && (
 <View>
 <Text>Camera Cutout Detected!</Text>
 <Text>Position: {cutouts.top.x}, {cutouts.top.y}</Text>
 <Text>Size: {cutouts.top.width}x{cutouts.top.height}px</Text>
 </View>
 )}
 </View>
 );
}

Safe Area Insets

Handle notches, dynamic islands, and status bars with precise safe area measurements.

Cutout Detection

Get exact coordinates and shapes of device cutouts (camera holes, sensors) for immersive layouts.

Pixel Perfect

High-precision geometry data for creating pixel-perfect designs on any device screen.

Framework Agnostic

Works seamlessly with Expo and bare React Native projects. No complex setup required.

Hooks & Static API

Flexible usage with `useDeviceGeometry` hook or static `DeviceGeometry` methods.

Type Safe

Built with TypeScript for full type safety and excellent developer experience.

The most comprehensive geometry library for React Native.