react-oxygen-ui

npm install react-oxygen-ui

You need to npm i styled-components if you haven't, but you don't need to learn styled-components at all, because everything is React props in react-oxygen-ui.

About

An style agnostic components library with a flexible and extendable API, which you can use to build your own components library. If you use Rebass before, this is just an enhanced version of it.

Highlights

• Final bundle is less than 2KB after gzip.
• Style agnostic, style it your way.
• Flexible API, build your own components library easily.
• Easy to pick up, every prop name is css prop.
• Rapid development, media query as an array or object, and no need to write CSS in most situation.
• Every component has a css prop, you can pass string, style object or styled-components's css string template.
• Written by TypeScript. We ship types from start. Enjoy the auto completeion.
• Based on styled-system and styled-components, so you can take full power of these 2 popular libraries, but actually, you can just use it without knowning the two.

10 Components

• Layout: <Box>
• Buttons: <Button>, <FlatButton>
• Inputs: <Input>, <Textarea>
• Text: <Text>, <Heading>, <Paragraph>
• Image: <Image>
• Foundation: <BaseBox>

Credits

• Rebass
• styled-system
• styled-components

Get started in a few minutes

• Your Input under one minute
• Add design system

Documentation

Check the 1min tutorial to get started