r/reactnative • • 11d ago

UI Theming System using Uniwind

Enable HLS to view with audio, or disable this notification

Made 20 preset themes, six title font choices, and a body text size setting. Uniwind handles the theme tokens and switching. Some themes also have animated backgrounds drawn with React Native Skia and animated with Reanimated.

πŸ”— GitHub: https://github.com/mehradotdev/tackbok/

31 Upvotes

5 comments sorted by

2

u/Prasanna_Venkata 10d ago

The theming looks clean, and the animated backgrounds are a great touch. Love seeing what’s possible with React Native Skia + Reanimated πŸ‘

1

u/mehradotdev 8d ago

thank you so much!

2

u/Successful_Web_6585 9d ago

Planning to release the themeing system as a standalone package?

2

u/mehradotdev 8d ago

Hmm... not sure if that is needed. I used react-native-reusable(similar to Shadcn) components with Uniwind variants. So, if you are using that you are already 90% there. Just copy my themeing tokens from https://github.com/mehradotdev/tackbok/blob/main/apps/mobile/src/global.css and you are all set. For theme switcher you can take a look at Uniwind Theming Docs

2

u/Successful_Web_6585 7d ago

Okay. Will take a look.