Manrope Font for React Native

Manrope font, packaged for React Native. Exports a typed weight map (PostScript names) that resolves correctly on both iOS and Android — no Platform.select, no manual fontFamily string guessing.

| | | |---|---| | React Native | 0.60+ | | iOS | ✓ | | Android | ✓ |

Install

npm install @devraj-labs/rn-font-manrope

Then add (or update) react-native.config.js in your app root to include the font assets:

module.exports = {
  assets: [
    './node_modules/@devraj-labs/rn-font-manrope/assets/fonts',
    // ...other font packages
  ],
};

Then link the fonts into your native projects:

npx react-native-asset

Re-run npx react-native-asset and rebuild your app whenever you add or update a font package.

Usage

With Vajra UI

Register the font in your theme and use it via the font prop:

import { manropeFonts } from '@devraj-labs/rn-font-manrope';

createVajraTheme({
  typography: {
    fonts: {
      families: {
        ...manropeFonts,
      },
    },
  },
});

<Text font="manrope" fontWeight="200">Sample text</Text>
<Text font="manrope" fontWeight="300">Sample text</Text>

Without Vajra UI

The export is a plain object — use it however your app resolves fonts:

import { manropeFonts } from '@devraj-labs/rn-font-manrope';

const styles = StyleSheet.create({
  // manropeFonts.manrope['200'] → 'Manrope-ExtraLight'
  heading: { fontFamily: manropeFonts.manrope['200'], fontSize: 24 },
  body:    { fontFamily: manropeFonts.manrope['800'], fontSize: 16 },
});

Font map

| Family | Weight | PostScript name | |--------|--------|-----------------| | manrope | '200' | 'Manrope-ExtraLight' | | manrope | '300' | 'Manrope-Light' | | manrope | '400' | 'Manrope-Regular' | | manrope | '500' | 'Manrope-Medium' | | manrope | '600' | 'Manrope-SemiBold' | | manrope | '700' | 'Manrope-Bold' | | manrope | '800' | 'Manrope-ExtraBold' |

Docs

• Using a font package — full usage guide including Vajra UI and standalone examples
• Creating a font package — how this package was built from the template
• README generation — how this file is auto-generated

License

MIT