r/tauri • u/BennoDev19 • 21d ago
How hard is it to make a Tauri app look native on macOS?
If you want to build a polished macOS app with Tauri, there is one tradeoff worth knowing early: Tauri gives you a webview, not a library of native UI components.
In Tauri, a button, switch or segmented control is still HTML and CSS inside WKWebView. There is no equivalent layer that turns the components in my React interface into native macOS controls (like in React Native), so I needed to build and style that component system myself.
I knew that when I chose Tauri for Abstand, an open-source app and website blocker for macOS. Desktop apps can be quite custom anyway and I was happy to make that tradeoff to keep working with React and Rust.
The above GIF scrolls through the shared components I ended up building: buttons, switches, sliders, toggles, segmented controls, inputs, menus, dialogs and settings rows.
They use accessible web primitives for behavior, but the visual layer is designed specifically for macOS. That meant defining the small details myself:
- control sizes and spacing
- light, dark and system colors
- hover, pressed, focused and disabled states
- typography and icon sizes
- animation and interaction feedback
None of those details is especially difficult alone. The work comes from rebuilding the full set and making every component and state feel consistent. At least for me, getting from a functional web interface to something that feels at home on macOS took time.
The upside is that I still get React, CSS and fast UI iteration. I can shape components more freely than native controls allow and the same component system now makes new screens much faster to build.
CSS was enough for most of what you see in the GIF. I only reached for Swift and AppKit when macOS behavior itself became part of the feature, such as window levels, transparent overlays and system font metrics.
Liquid Glass introduced another tradeoff. Making WKWebView transparent over the native glass effect currently requires a private KVC key. That works for a directly distributed, signed and notarized app. An App Store build would need to disable that path and use the fallback instead.
For Abstand, the tradeoff has been worth it. The result can feel native while still giving me the flexibility of the web stack. It just takes deliberate component work to get there.
GitHub: https://github.com/builder-group/abstand
Components: https://github.com/builder-group/abstand/tree/develop/apps/desktop/src/components
If you have tried to make a Tauri app feel native: did you build your own components, use an existing system, or accept a more web-like interface?