https://github.com/ivstudio/tyger-ui

Themeable React UI component library
https://github.com/ivstudio/tyger-ui

component-library components dark-mode design-system frontend-components js-library lerna react react-components react-library styled-components styled-system typescript-library ui ui-library

Last synced: 18 days ago
JSON representation

Themeable React UI component library

• Host: GitHub
• URL: https://github.com/ivstudio/tyger-ui
• Owner: ivstudio
• Created: 2022-07-02T21:06:13.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-02-18T00:37:19.000Z (10 months ago)
• Last Synced: 2024-11-10T18:53:39.342Z (about 1 month ago)
• Topics: component-library, components, dark-mode, design-system, frontend-components, js-library, lerna, react, react-components, react-library, styled-components, styled-system, typescript-library, ui, ui-library
• Language: TypeScript
• Homepage: https://main--62cb3e5f2ca3572c994908ed.chromatic.com/?path=/story/components-button--filled
• Size: 3.55 MB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  Tyger UI







  Tyger-ui is a React-based component library for the web.

  



![npm](https://img.shields.io/npm/v/@tyger-ui/react)

![npm type definitions](https://img.shields.io/npm/types/@tyger-ui/react)

![npm](https://img.shields.io/npm/dm/@tyger-ui/react)

[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/mui/material-ui/blob/HEAD/LICENSE)



## ✨ Features

-   A set of high-quality React components.

-   Written using TypeScript and Styled Components.

-   Powerful theme customization.

-   Server-side Rendering support.

[**Try it out on CodeSandbox ▸**](https://codesandbox.io/s/amazing-danny-i26k2y?fontsize=14&hidenavigation=1&theme=dark)

## Installation

-   Tyger UI is available as an [npm package](https://www.npmjs.com/package/@tyger-ui/react).

-   Tyger UI system is available as an [npm package](https://www.npmjs.com/package/@tyger-ui/system).




**npm:**

```sh

npm i @tyger-ui/react @tyger-ui/system styled-components framer-motion

```

**yarn:**

```sh

yarn add @tyger-ui/react @tyger-ui/system styled-components framer-motion

```

**SVG icons**

tyger-ui is currently using react-icons on its components.

```sh

npm install react-icons --save

# or

yarn add react-icons

```




---




## Getting started with Tyger UI

```jsx

import * as React from 'react';

import { Button } from '@tyger-ui/react';

function App() {

	return Hello World;

}

```

[![Edit tyger-ui](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/amazing-danny-i26k2y?fontsize=14&hidenavigation=1&theme=dark)

## Storybook documentation

-   [Tyger UI Storybook](https://main--62cb3e5f2ca3572c994908ed.chromatic.com/?path=/story/components-button--filled)

## Roadmap and contributors

tyger-ui is currently under development and it welcomes contributors.

## License

MIT License © 2023 [ivstudio](https://github.com/ivstudio)