u/zCR0ME

Hi everyone,

I recently started with app development and I am building a B2B SaaS/app. The app is meant to run on Desktop, Android and iOS

My current stack is Flutter/Dart. The app is already fairly far along: project management, materials/import logic, user/company handling, documentation workflows, and several business-specific screens are already implemented.

The main problem I am struggling with is the UI.

I have a Figma design with a modern “Soft Glass” style: subtle gradients, soft shadows, glass-like cards, dark/light mode, polished mobile cards, and a floating action button. The Figma design was originally very web/Tailwind-like, with values such as semi-transparent zinc backgrounds, rings, CSS shadows, inset shadows, gradients, hover/pressed states, etc.

I tried to transfer this design to Flutter, but it has been very difficult. The result often looks wrong on the Android emulator:

• gradients become too harsh or look like diagonal “wedges”
• shadows turn into dark blobs
• the UI sometimes looks too flat after reducing the gradients
• light and dark mode values were accidentally mixed in some attempts
• CSS-style rings/inset shadows do not seem to translate cleanly to Flutter
• the Android emulator rendering makes it hard for me to judge whether the design is actually wrong or just rendered differently

Even after several iterations, the Flutter result still does not feel close enough to the Figma Soft Glass UI.

At this Point, Does it make sense to stay with Flutter for this kind of UI, or should I consider switching to React/React Native/Tauri or another stack?

My requirements are:

• one codebase if possible
• desktop + Android + iOS
• good-looking modern UI
• B2B/productivity app, not a game
• I am currently working alone
• I only recently started with app development
• I want to avoid rewriting everything unless there is a very strong reason

I understand that React/Tailwind may reproduce this specific Figma/Web-style UI more directly, but Flutter seems attractive because of cross-platform support, especially desktop + mobile from one codebase.

My questions:

1. Is Flutter still a good choice for a polished Soft Glass UI across desktop, Android, and iOS?
2. Are these visual problems mostly caused by trying to translate web/Tailwind CSS effects too literally into Flutter?
3. Would testing on a real Android device make a big difference compared to the Android Studio emulator for gradients/shadows?
4. Would React Native or React + Tauri be a better fit for this kind of UI and platform target?
5. If I stay with Flutter, what would be the best approach to implement this design properly?
   • custom design tokens?
   • custom card components?
   • avoiding CSS-like glassmorphism?
   • using fewer gradients/shadows?
   • different rendering settings?
6. At what point would you recommend switching stacks instead of continuing to refine the Flutter UI?

I would really appreciate practical advice from people who have experience with Flutter, React Native, Tauri, or cross-platform business apps.

I am not trying to start a “Flutter vs React” debate. I am mainly trying to avoid making a bad long-term technical decision early in the project.

Thanks!

Hi everyone,

I recently started with app development and I am building a B2B SaaS/app. The app is meant to run on Desktop, Android and iOS

My current stack is Flutter/Dart. The app is already fairly far along: project management, materials/import logic, user/company handling, documentation workflows, and several business-specific screens are already implemented.

The main problem I am struggling with is the UI.

I have a Figma design with a modern “Soft Glass” style: subtle gradients, soft shadows, glass-like cards, dark/light mode, polished mobile cards, and a floating action button. The Figma design was originally very web/Tailwind-like, with values such as semi-transparent zinc backgrounds, rings, CSS shadows, inset shadows, gradients, hover/pressed states, etc.

I tried to transfer this design to Flutter, but it has been very difficult. The result often looks wrong on the Android emulator:

• gradients become too harsh or look like diagonal “wedges”
• shadows turn into dark blobs
• the UI sometimes looks too flat after reducing the gradients
• light and dark mode values were accidentally mixed in some attempts
• CSS-style rings/inset shadows do not seem to translate cleanly to Flutter
• the Android emulator rendering makes it hard for me to judge whether the design is actually wrong or just rendered differently

Even after several iterations, the Flutter result still does not feel close enough to the Figma Soft Glass UI.

At this Point, Does it make sense to stay with Flutter for this kind of UI, or should I consider switching to React/React Native/Tauri or another stack?

My requirements are:

• one codebase if possible
• desktop + Android + iOS
• good-looking modern UI
• B2B/productivity app, not a game
• I am currently working alone
• I only recently started with app development
• I want to avoid rewriting everything unless there is a very strong reason

I understand that React/Tailwind may reproduce this specific Figma/Web-style UI more directly, but Flutter seems attractive because of cross-platform support, especially desktop + mobile from one codebase.

My questions:

1. Is Flutter still a good choice for a polished Soft Glass UI across desktop, Android, and iOS?
2. Are these visual problems mostly caused by trying to translate web/Tailwind CSS effects too literally into Flutter?
3. Would testing on a real Android device make a big difference compared to the Android Studio emulator for gradients/shadows?
4. Would React Native or React + Tauri be a better fit for this kind of UI and platform target?
5. If I stay with Flutter, what would be the best approach to implement this design properly?
   • custom design tokens?
   • custom card components?
   • avoiding CSS-like glassmorphism?
   • using fewer gradients/shadows?
   • different rendering settings?
6. At what point would you recommend switching stacks instead of continuing to refine the Flutter UI?

I would really appreciate practical advice from people who have experience with Flutter, React Native, Tauri, or cross-platform business apps.

I am not trying to start a “Flutter vs React” debate. I am mainly trying to avoid making a bad long-term technical decision early in the project.

Thanks!