# Neu UI

![github issues shield](https://img.shields.io/github/issues/daniel-norris/neumorphic_design)
![releases](https://img.shields.io/github/v/release/daniel-norris/neu_ui?include_prereleases)
![build](https://img.shields.io/github/workflow/status/daniel-norris/neu_ui/Release)
![github licence](https://img.shields.io/github/license/daniel-norris/neu_ui)
![github commit activity shield](https://img.shields.io/github/commit-activity/m/daniel-norris/neumorphic_design)
![twitter](https://img.shields.io/twitter/follow/danielpnorris)
![repository example](src/demo.gif)

Prototype and build projects faster using Neu UI - the neumorphic React component library.

## Translations
- [Vietnamese](./translations/vietnamese/README.md)
- [Brazilian Portuguese](./translations/portuguese/README.md)
- [French](./translations/french/README.md)
- [Malay](./translations/malay/README.md)
- [Italian](./translations/italian/README.md)
- [Polish](./translations/polish/README.md)
- [Greek](./translations/greek/README.md)
- [German](./translations/german/README.md)
- [Spanish](./translations/spanish/README.md)

## Contents

- ❓ About
- 🚀 Getting Started
- 📝 Documentation
- 👏 Contributing
- ⚖️ Licence

## About

Neu UI started life as a small side project exploring UI component design and development using neumorphic design.

The style was originally conceptualised by [Alexander Plyuto](https://dribbble.com/alexplyuto) in late 2019 and "neumorphism", a mixture between skeumorphism and material design, was coined by Michal Malewicz shortly afterwards.

For further information about the design, it's worthwhile taking a look at Alexander Plyuto's guide [here](https://www.figma.com/file/J1uPSOY5k577mDpSfGFven/Neomorphism-Guide-2.0-%7C-Original?node-id=26580%3A1425).

The initial components have now been converted and extended to include a whole suite of initial controlled form and card components into a React library. It uses React under the hood, Storybook as a tool to visualise the components and Styled Components to well, style the components.

We are looking for anyone interested in contributing, for further information check out the contribution section below.

## Getting Started

#### Installation

Installing using `npm`.

```
npm i ui-neu
```

Installing using `yarn`.

```
yarn add ui-neu
```

Import a component.

```
import { Card } from 'ui-neu'
```

## Docs

Docs are available and include information on props, how to start contributing and a contribution guide.

[View the Neu UI docs here](https://ui-neu.netlify.app/)

## Contributing

If you're interested in contributing, then any support from documentation, to bugfixes to even new feature improvements is welcome.

- Pull requests and ⭐ stars are welcome!
- Read the [start contributing](CONTRIBUTING.md) guide to find out ways in which you can start contributing
- If you are looking for more detailed information on how to contribute then take a look at our [contribution guide](CONTRIBUTING_GUIDE.md)

Looking for a first issue to take on?

- Look out for [good first issue](https://github.com/daniel-norris/neu_ui/labels/good%20first%20issue) labels
- Not ready to make a code contribution yet? Then look out for our [documentation](https://github.com/daniel-norris/neu_ui/labels/documentation) labels
- Need support or help? Reach out to me, [Dan](https://twitter.com/danielpnorris) on Twitter

## Licence

This project is [MIT](/LICENSE) licenced.