What is the default unit for width, height, padding etc in React Native for iOS?

Question

I am building a React Native application for iOS. The facebook documentation says width, height, padding, margin etc. takes a number.

I wanted to know what the default unit of styling is.

<View style={styles.box}>
   <Text style={styles.text}> Test Component </Text>
</View>

var styles = ReactNative.StyleSheet.create({
       box: {
          padding: 10,
          width:100,
          height:100,
       },
       text: {
          color: 'black',
          fontSize: 30,
       },
});

Answer 1

From the docs:

All dimensions in React Native are unitless, and represent density-independent pixels. Setting dimensions this way is common for components that should always render at exactly the same size, regardless of screen dimensions.

So the unit dimension is dp.

Answer 2

I Tested.

Android Native with DP unit

vs

Android React Native

iOS Native with Point unit

vs

iOS React Native

Result

At least, the unit in RN is approximately the same as dp in Android and pt in iOS.

Also, the unit in RN is applied sp value in Android for scale font size.

---

Code

RN

      <SafeAreaView style={{flex: 1, backgroundColor: 'black'}}>
        <View
          style={{
            justifyContent: 'center',
            alignItems: 'center',
            backgroundColor: 'white',
            width: 150,
            height: 150,
            marginTop: 100,
            marginStart: 100,
          }}>
          <Text style={{color: 'black', textAlign: 'center', fontSize: 16}}>
            {'[React Native]\n100 x 100\nmargin top = 100\nmargin start = 100\n\nfontSize = 16\nㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁ'}
          </Text>
        </View>
      </SafeAreaView>

Android

        <TextView
            android:layout_width="150dp"
            android:layout_height="150dp"
            android:layout_marginStart="100dp"
            android:layout_marginTop="100dp"
            android:background="#fff"
            android:gravity="center"
            android:text="[ANDROID]\n\n100dp x 100dp\nmargin top = 100dp\nmargin start = 100dp\n\n textSize = 16sp\nㅁㅁㅁㅁㅁㅁㅁㅁㅁㅁ"
            android:textColor="#000"
            android:textSize="16sp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />