PixelRatio

static get(): number

import { PixelRatio } from 'react-native';

const pixelRatio = PixelRatio.get();
console.log('Device pixel ratio:', pixelRatio);
// On iPhone X: 3
// On standard Android: 2

static getFontScale(): number

import { PixelRatio } from 'react-native';

const fontScale = PixelRatio.getFontScale();
const baseFontSize = 16;
const actualFontSize = baseFontSize * fontScale;

console.log('Font scale:', fontScale);
console.log('Actual font size:', actualFontSize);

static getPixelSizeForLayoutSize(layoutSize: number): number

import { PixelRatio, Image } from 'react-native';

// Fetch appropriately sized image
const layoutSize = 200;
const pixelSize = PixelRatio.getPixelSizeForLayoutSize(layoutSize);

const image = getImage({
  width: PixelRatio.getPixelSizeForLayoutSize(200),
  height: PixelRatio.getPixelSizeForLayoutSize(100),
});

// On a 2x device: 200 * 2 = 400px
// On a 3x device: 200 * 3 = 600px

static roundToNearestPixel(layoutSize: number): number

import { PixelRatio, StyleSheet } from 'react-native';

const styles = StyleSheet.create({
  hairline: {
    borderWidth: PixelRatio.roundToNearestPixel(0.5),
  },
  box: {
    width: PixelRatio.roundToNearestPixel(100.7),
    // On 3x device: 100.7 * 3 = 302.1 → 302px → 302/3 = 100.67
  }
});

// Example: on a device with PixelRatio of 3
const rounded = PixelRatio.roundToNearestPixel(8.4);
// 8.4 * 3 = 25.2 → rounds to 25px
// 25 / 3 = 8.33 (returned value)

import { PixelRatio } from 'react-native';

function getImageSource(baseUrl, width, height) {
  const pixelWidth = PixelRatio.getPixelSizeForLayoutSize(width);
  const pixelHeight = PixelRatio.getPixelSizeForLayoutSize(height);
  
  return {
    uri: `${baseUrl}?w=${pixelWidth}&h=${pixelHeight}`,
  };
}

// Usage
const source = getImageSource(
  'https://example.com/image.jpg',
  200,
  150
);

<Image source={source} style={{width: 200, height: 150}} />

import { PixelRatio, StyleSheet } from 'react-native';

const styles = StyleSheet.create({
  hairlineWidth: {
    borderBottomWidth: 1 / PixelRatio.get(),
  },
  // Or use the built-in constant
  separator: {
    borderBottomWidth: StyleSheet.hairlineWidth,
  }
});

import { PixelRatio, Dimensions } from 'react-native';

const { width } = Dimensions.get('window');
const fontScale = PixelRatio.getFontScale();

// Scale font based on screen width and user preference
const baseFontSize = width < 375 ? 14 : 16;
const fontSize = baseFontSize * fontScale;

import { PixelRatio } from 'react-native';

const calculated = someValue * 0.33;
const snapped = PixelRatio.roundToNearestPixel(calculated);