Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
React Native Font Weight Cheatsheet iOS
{ fontWeight: '100' }, // Thin
{ fontWeight: '200' }, // Ultra Light
{ fontWeight: '300' }, // Light
{ fontWeight: '400' }, // Regular
{ fontWeight: '500' }, // Medium
{ fontWeight: '600' }, // Semibold
{ fontWeight: '700' }, // Bold
{ fontWeight: '800' }, // Heavy
{ fontWeight: '900' }, // Black
@furball514
Copy link

furball514 commented Aug 1, 2017

nice!

@hotsen
Copy link

hotsen commented Aug 7, 2017

Aaaah. Zen ...

@lexuanquynh
Copy link

lexuanquynh commented Nov 24, 2017

thanks

@Osama92
Copy link

Osama92 commented Apr 6, 2018

Awesome!

@CoderXpert
Copy link

CoderXpert commented May 3, 2018

💯

@ApoorvTheTecHie
Copy link

ApoorvTheTecHie commented May 24, 2018

Thanks mate, helped a lot.

@ArthurInTheShell
Copy link

ArthurInTheShell commented Jun 5, 2018

It helps a lot! Thanks!

@tonypee
Copy link

tonypee commented Jun 22, 2018

export const fontWeights = {
  Thin: 100,
  UltraLight: 200,
  Light: 300,
  Regular: 400,
  Medium: 500,
  Semibold: 600,
  Bold: 700,
  Heavy: 800,
  Black: 900
};

@buechner
Copy link

buechner commented Jul 19, 2018

@tonypee: for usage in StyleSheet i needed to change this to

export const fontWeight = {
    Thin: "100",
    UltraLight: "200",  
    Light: "300",
    Regular: "400",
    Medium: "500",
    Semibold: "600",
    Bold: "700",
    Heavy: "800",
    Black: "900"
};

@badarshahzad
Copy link

badarshahzad commented Jul 27, 2018

Sorry but 100 to 400 is not working and 500 is working like 'bold' property. Did you notice this thing?

@stantoncbradley
Copy link

stantoncbradley commented Sep 5, 2018

You can use https://www.npmjs.com/package/react-native-cross-platform-text to consolidate iOS and Android font weights into the same API

@michaelVictoriaDev
Copy link

michaelVictoriaDev commented Aug 20, 2020

WOW thanks for this.

@buithanhquan1994
Copy link

buithanhquan1994 commented Jun 15, 2021

Nice! Thanks so much

@Satur-nity
Copy link

Satur-nity commented Jul 6, 2021

@pataratanan
Copy link

pataratanan commented Apr 20, 2022

Thank you very much legend!!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment