Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/gluestack/gluestack-ui

React & React Native Components & Patterns (copy-paste components & patterns crafted with Tailwind CSS (NativeWind))
https://github.com/gluestack/gluestack-ui

accessibility component-library customizable-components design-system react react-native styled-components ui ui-components universal-components

Last synced: 10 days ago
JSON representation

React & React Native Components & Patterns (copy-paste components & patterns crafted with Tailwind CSS (NativeWind))

Host: GitHub
URL: https://github.com/gluestack/gluestack-ui
Owner: gluestack
License: mit
Created: 2023-01-11T12:03:50.000Z (almost 2 years ago)
Default Branch: main
Last Pushed: 2024-10-14T10:02:04.000Z (25 days ago)
Last Synced: 2024-10-14T10:06:52.863Z (25 days ago)
Topics: accessibility, component-library, customizable-components, design-system, react, react-native, styled-components, ui, ui-components, universal-components
Language: TypeScript
Homepage: https://gluestack.io/
Size: 87 MB
Stars: 2,499
Watchers: 20
Forks: 116
Open Issues: 106
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

awesome - gluestack/gluestack-ui - React & React Native Components & Patterns (copy-paste components & patterns crafted with Tailwind CSS (NativeWind)) (TypeScript)
awesome-nextjs - Gluestack UI - Gluestack UI includes copy-paste React and React Native components and patterns designed with Tailwind CSS. (React UI Library)
awesome-universal-react - Gluestack UI - Universal headless components for React Native, Next.js & React with beautiful & optional styling (Design Systems / Others)

README

# gluestack-ui v2

[![Next.js Latest](https://github.com/gluestack/gluestack-ui/actions/workflows/next-latest.yml/badge.svg)](https://github.com/gluestack/gluestack-ui/actions/workflows/next-latest.yml)
[![Next.js 14](https://github.com/gluestack/gluestack-ui/actions/workflows/next-14.yml/badge.svg)](https://github.com/gluestack/gluestack-ui/actions/workflows/next-14.yml)
[![Next.js 13](https://github.com/gluestack/gluestack-ui/actions/workflows/next-13.yml/badge.svg)](https://github.com/gluestack/gluestack-ui/actions/workflows/next-13.yml)

## Introduction

**gluestack-ui v2** offers customizable, beautifully designed components for your projects. Unlike traditional libraries, it's not a pre-packaged dependency. Choose the components you need and copy-paste them directly into your React, Next.js & React Native projects.

## Documentation

You can find detailed documentation for each component, including a list of props and examples, in https://gluestack.io/ui/docs website.

## Features

- **Modular Architecture:** Pick and choose the components you need without unnecessary bloat.
- **NativeWind Integration:** Tailwind CSS support for seamless styling across web and mobile.
- **RSC Compatible:** Optimized for React Server Components to enhance performance.
- **Universal Design:** Consistent design across web and mobile platforms.
- **Flexible Theming:** Customize your components with ease using theming tokens and configuration.
- **Accessibility:** Built with robust accessibility features to ensure inclusivity.
- **Frequent updates:** We are constantly working on improving the library and adding new components. Follow us on GitHub to stay up-to-date on the latest releases and features.
- **Community support:** Need help using the library or have a suggestion for a new feature? Join our [Discord](https://discord.com/invite/95qQ84nf6f) channel to connect with the community and get support.

## Installing **gluestack-ui v2**

To get started with **gluestack-ui v2**, you must have an existing Next.js or Expo project. Then, simply run the following command:

```bash
npx gluestack-ui init
```

For detailed installation instructions, visit the [gluestack-ui v2 installation guide](https://gluestack.io/ui/docs/home/getting-started/installation).

## Tech Stack

JavaScript, React, React Native, Styled System

## Getting Started

- **Install gluestack-ui:** Follow the [installation guide](https://gluestack.io/ui/docs/home/getting-started/installation).
- **Add Components:** Use our CLI to add components to your project, or simply copy-paste from our documentation.
- **Customize:** Tailor the components to fit your project's needs using theming tokens and configuration.
- **Build:** Start building your app with a consistent, accessible, and high-performance UI.

## Migration from gluestack-ui v1

If you're migrating from gluestack-ui v1, we've got you covered with a detailed [migration guide](https://gluestack.io/ui/docs/home/overview/upgrade-to-v2) with codemod.

## Created By GeekyAnts

GeekyAnts is a team of React Native experts who love open-source and solving developer problems. We’ve been working on React Native since 2015 and have designed and built React Native apps for almost 200+ clients across the globe. Our clients include startups to big enterprises! Need help with your React Native app?

[Contact Us](https://geekyants.com/?utm_source=gluestack_github&utm_medium=read_me&utm_campaign=gluestack_integration)

## Contributing

We welcome contributions to the `gluestack-ui`. If you have an idea for a new component or a bug fix, please read our [contributing guide](./CONTRIBUTING.md) instructions on how to submit a pull request.

## License