skyle

skyle copied to clipboard

An experimental universal, customizable styling and animation
library for React Native.

Why? ⎯ Features ⎯ Website ⎯ Documentation ⎯ Get Started ⎯ Examples/Demos ⎯ Contributing!

• 💡 Beautiful & Easy Syntax
• ⚡ Performant
• 🎨 Highly Customizable
• 🔼 Expo Compatible
• 🧩 Works on all Platforms! (iOS, Android, Web, Windows, Mac, etc.)
• 🌟 Supports Media Queries, Theming, Transitions and more!
• ☑️ Written in TypeScript

Why?

Skyle aims to provide styling utilities and to fill in the missing features that are available in CSS but not in React-Native. When switching between the two, the missing APIs become prominent. This is the main reason why this project was developed: Making styling a heck of a lot easier.

Features

• ✔️ Shorthands
• ✔️ Length Units
• ✔️ Theming
• ✔️ Variables, State & Props
• ✔️ Spread Props
• ✔️ Media Queries
• ✔️ Breakpoints
• ✔️ Transitions
• ✔️ Pseudo Classes & Elements
• ✔️ Aliases
• ✔️ Custom Preprocessors

and more!

View all available properties

Get Started

Installation

npm install skyle
# or
yarn add skyle

View more on the Get Started documentation page.

Documentation

View the official Documentation on our site.

Changelog

Please see CHANGELOG.md

Contributing

Please read CONTRIBUTING.md

❤️ Inspiration

• react-native-extended-stylesheet by vitalets
• react-native-animatable by oblador
• moti by nandorojo
• react-native-stylex by retyui

License

MIT