carbon-native

by carbon-native

carbon-native / carbon-native

A set of UI components for building React Native apps

212 Stars 27 Forks Last release: Not found MIT License 205 Commits 9 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

Carbon Native

A set of UI components for building React Native apps

CircleCI npm version code style: prettier PRs Welcome License

Demo App

Get Started

yarn add carbon-native

Components

Badge

Badge

import {
  Badge,
} from 'carbon-native';

⬆ back to top

Buttons

Buttons

import {
  Button,
} from 'carbon-native';

⬆ back to top

Card

Card

import {
  Card,
  H4,
} from 'carbon-native';


  

Header

Just some text rambling on.

⬆ back to top

Icons

Icons

npm install react-native-vector-icons --save
rnpm link
import Icon 'react-native-vector-icons/FontAwesome';

⬆ back to top

List

List

import {
  List,
  Item,
  ItemIcon,
  ItemContent,
  ItemText,
  Note,
} from 'carbon-native';


  
    
      
    
    
      Harry
      The boy who lived
    
  

⬆ back to top

Range

Range

import {
  Range,
} from 'carbon-native';

this.setState({ value })} />

⬆ back to top

Toggle

Toggle

import {
  Toggle,
} from 'carbon-native';

this.setState({ toggleState: value })} value={this.state.toggleState} />

⬆ back to top

Toolbar

Toolbar

import {
  Toolbar,
  ToolbarTitle,
} from 'carbon-native';


  Primary

⬆ back to top

Typography

Typography

import {
  H1,
  H2,
  H3,
  H4,
  H5,
  H6,
  P,
  BR,
  Em,
  Small,
  Strong,
  S,
  U,
} from 'carbon-native';

I'm an H1!

I'm an H2!

I'm an H3!

I'm an H4!

I'm an H5!
I'm an H6!

I'm a paragraph with some text!


This line is preceeded by a break

This line has a break
before the end of the line.

This line is small and is a great size for fine print.

This line is bold to indicate importance.

This line is italicized to indicate emphasis.

This line has a strikethrough, or a line through it.

This line has an underline.

Use the Mark component to highlight text

⬆ back to top

Contribute

Contribution guidelines for this project

License

MIT License

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.