Platform
Example
import React from 'react';
import {Platform, StyleSheet, Text, ScrollView} from 'react-native';
import {SafeAreaView, SafeAreaProvider} from 'react-native-safe-area-context';
const App = () => {
return (
<SafeAreaProvider>
<SafeAreaView style={styles.safeArea}>
<ScrollView contentContainerStyle={styles.container}>
<Text>OS</Text>
<Text style={styles.value}>{Platform.OS}</Text>
<Text>OS Version</Text>
<Text style={styles.value}>{Platform.Version}</Text>
<Text>isTV</Text>
<Text style={styles.value}>{Platform.isTV.toString()}</Text>
{Platform.OS === 'ios' && (
<>
<Text>isPad</Text>
<Text style={styles.value}>{Platform.isPad.toString()}</Text>
</>
)}
{Platform.OS === 'kepler' && <>
<Text>keplerOSVariant</Text>
<Text style={styles.value}>{Platform.constants.keplerOSVariant}</Text>
</>}
<Text>Constants</Text>
<Text style={styles.value}>
{JSON.stringify(Platform.constants, null, 2)}
</Text>
</ScrollView>
</SafeAreaView>
</SafeAreaProvider>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
value: {
fontWeight: '600',
padding: 4,
marginBottom: 8,
},
safeArea: {
flex: 1,
},
});
export default App;
Reference
Properties
constants
static constants: PlatformConstants;
Returns an object which contains all available common and specific constants related to the platform.
Properties:
| Name | Type | Optional | Description |
|---|---|---|---|
| isTesting | boolean | No | |
| reactNativeVersion | object | No | Information about React Native version. Keys are major, minor, patch with optional prerelease and values are numbers. |
| Version Android Vega Not Available | number | No | OS version constant specific to Android. |
| Release Android Vega Not Available | string | No | |
| Serial Android Vega Not Available | string | No | Hardware serial number of an Android device. |
| Fingerprint Android Vega Not Available | string | No | A string that uniquely identifies the build. |
| Model Android Vega Not Available | string | No | The end-user-visible name for the Android device. |
| Brand Android Vega Not Available | string | No | The consumer-visible brand with which the product/hardware will be associated. |
| Manufacturer Android Vega Not Available | string | No | The manufacturer of the Android device. |
| ServerHost Android Vega Not Available | string | Yes | |
| uiMode Android Vega | string | No | Possible values are: 'car', 'desk', 'normal','tv', 'watch' and 'unknown'. Read more about Android ModeType. |
| forceTouchAvailable iOS Vega Not Available | boolean | No | Indicate the availability of 3D Touch on a device. |
| interfaceIdiom iOS Vega Not Available | string | No | The interface type for the device. Read more about UIUserInterfaceIdiom. |
| osVersion iOS Vega Not Available | string | No | OS version constant specific to iOS. |
| systemName iOS Vega Not Available | string | No | OS name constant specific to iOS. |
| keplerOSVariant Vega | string | No | Identifies the OS sub-platform under the Vega OS umbrella. Possible values are: 'apple', 'android', and 'kepler'. 'apple' is experimental for Amazon use only. Specific to Vega. |
isPad iOS Vega Not Available
static isPad: boolean;
Returns a boolean which defines if device is an iPad.
| Type |
|---|
| boolean |
isTV
static isTV: boolean;
Returns a boolean which defines if device is a TV.
| Type |
|---|
| boolean |
isVision Vega Not Available
static isVision: boolean;
Returns a boolean which defines if device is an Apple Vision. If you are using Apple Vision Pro (Designed for iPad) isVision will be false but isPad will be true
| Type |
|---|
| boolean |
isTesting
static isTesting: boolean;
Returns a boolean which defines if application is running in Developer Mode with testing flag set.
| Type |
|---|
| boolean |
OS
static OS: 'android' | 'ios' | 'kepler';
Returns string value representing the current OS.
| Type |
|---|
enum('android', 'ios', 'kepler') |
Version Vega Not Available
static Version: 'number' | 'string';
Returns the version of the OS.
| Type |
|---|
| number Android string iOS |
Methods
select()
static select(config: Record<string, T>): T;
Returns the most fitting value for the platform you are currently running on.
Parameters:
| Name | Type | Required | Description |
|---|---|---|---|
| config | object | Yes | See config description below. |
Select method returns the most fitting value for the platform you are currently running on. That is, if you're running on a phone, android and ios keys will take preference. If those are not specified, kepler key then native key will be used and then the default key.
The config parameter is an object with the following keys:
android(any)ios(any)kepler(any)native(any)default(any)
Example usage:
import {Platform, StyleSheet} from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
...Platform.select({
android: {
backgroundColor: 'green',
},
ios: {
backgroundColor: 'red',
},
kepler: {
backgroundColor: 'yellow',
},
default: {
// other platforms, web for example
backgroundColor: 'blue',
},
}),
},
});
This will result in a container having flex: 1 on all platforms, a green background color on Android, a red background color on iOS, a yellow background on Vega, and a blue background color on other platforms.
Since the value of the corresponding platform key can be of type any, select method can also be used to return platform-specific components, like below:
const Component = Platform.select({
ios: () => require('ComponentIOS'),
android: () => require('ComponentAndroid'),
kepler: () => require('ComponentKepler'),
})();
<Component />;
const Component = Platform.select({
native: () => require('ComponentForNative'),
default: () => require('ComponentForWeb'),
})();
<Component />;
Last updated: May 13, 2026
