// Within own file --- BodyText.js const BodyText = props => <Text style={styles.body}> {props.children}</Text> const styles = StyleSheet.create({ body: { fontFamily: "open-sans" } }); export default BodyText Within file where font/font weight needed <BodyText> I am in open sans font </BodyText> To include styles within the the specified file also follow the next syntax instead const BodyText = props => <Text style={...styles.body, props.style}> {props.children}</Text> Another option would be to create a seperate globally managed style set which could be used to contain any styles other than fonts then imported into where its needed const styles = StyleSheet.create({ bodyText: { fontFamily: "open-sans" }, title: { fontFamily: "open-sans-bold" fontWeight: "bold", } }); import defaultStyles from "FILE-NAME " <Text style={defaultStyles.bodyText}> I am in open sans font </Text>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter