The latest articles on DEV Community by Gaurav Singh (@gauravchadhry). https://dev.to/gauravchadhry https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3257623%2Fbf191c43-043f-41bb-a071-3c08f86f0455.jpg https://dev.to/gauravchadhry en Gaurav Singh Sat, 21 Jun 2025 06:53:54 +0000 https://dev.to/gauravchadhry/just-dropped-a-new-glass-variant-in-crossbuild-ui-aj5 https://dev.to/gauravchadhry/just-dropped-a-new-glass-variant-in-crossbuild-ui-aj5 <p>If you’re building an Expo + React Native app and want clean, modern, Figma-inspired components — this update is for you.</p> <p>Now you can apply glassmorphism to components out of the box — style, blur, and depth with a single variant prop.</p> <p>👉 <a href="https://www.crossbuildui.com/" rel="noopener noreferrer">crossbuildui.com</a><br> ⭐ <a href="https://github.com/crossbuildui/crossbuildui" rel="noopener noreferrer">github.com/crossbuildui</a></p> <p>New components drop every 15 days — follow for updates!</p> reactnative mobile ios Gaurav Singh Wed, 11 Jun 2025 09:26:03 +0000 https://dev.to/gauravchadhry/-22fl https://dev.to/gauravchadhry/-22fl <div class="ltag__link--embedded"> <div class="crayons-story "> <a href="https://dev.to/gauravchadhry/crossbuild-ui-figma-inspired-expo-react-native-ui-kit-with-instant-cli-setup-3j1f" class="crayons-story__hidden-navigation-link">🚀 Crossbuild UI – Figma-Inspired Expo + React Native UI Kit with Instant CLI Setup!</a> <div class="crayons-story__body crayons-story__body-full_post"> <div class="crayons-story__top"> <div class="crayons-story__meta"> <div class="crayons-story__author-pic"> <a href="/gauravchadhry" class="crayons-avatar crayons-avatar--l "> <img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3257623%2Fbf191c43-043f-41bb-a071-3c08f86f0455.jpg" alt="gauravchadhry profile" class="crayons-avatar__image"> </a> </div> <div> <div> <a href="/gauravchadhry" class="crayons-story__secondary fw-medium m:hidden"> Gaurav Singh </a> <div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"> Gaurav Singh <div id="story-author-preview-content-2584320" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"> <div class="gap-4 grid"> <div class="-mt-4"> <a href="/gauravchadhry" class="flex"> <span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"> <img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3257623%2Fbf191c43-043f-41bb-a071-3c08f86f0455.jpg" class="crayons-avatar__image" alt=""> </span> <span class="crayons-link crayons-subtitle-2 mt-5">Gaurav Singh</span> </a> </div> <div class="print-hidden"> Follow </div> <div class="author-preview-metadata-container"></div> </div> </div> </div> </div> <a href="https://dev.to/gauravchadhry/crossbuild-ui-figma-inspired-expo-react-native-ui-kit-with-instant-cli-setup-3j1f" class="crayons-story__tertiary fs-xs"><time>Jun 11 '25</time><span class="time-ago-indicator-initial-placeholder"></span></a> </div> </div> </div> <div class="crayons-story__indention"> <h2 class="crayons-story__title crayons-story__title-full_post"> <a href="https://dev.to/gauravchadhry/crossbuild-ui-figma-inspired-expo-react-native-ui-kit-with-instant-cli-setup-3j1f" id="article-link-2584320"> 🚀 Crossbuild UI – Figma-Inspired Expo + React Native UI Kit with Instant CLI Setup! </a> </h2> <div class="crayons-story__tags"> <a class="crayons-tag crayons-tag--monochrome " href="/t/ui"><span class="crayons-tag__prefix">#</span>ui</a> <a class="crayons-tag crayons-tag--monochrome " href="/t/reactnative"><span class="crayons-tag__prefix">#</span>reactnative</a> <a class="crayons-tag crayons-tag--monochrome " href="/t/mobile"><span class="crayons-tag__prefix">#</span>mobile</a> <a class="crayons-tag crayons-tag--monochrome " href="/t/webdev"><span class="crayons-tag__prefix">#</span>webdev</a> </div> <div class="crayons-story__bottom"> <div class="crayons-story__details"> <a href="https://dev.to/gauravchadhry/crossbuild-ui-figma-inspired-expo-react-native-ui-kit-with-instant-cli-setup-3j1f" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left"> <div class="multiple_reactions_aggregate"> <span class="multiple_reactions_icons_container"> <span class="crayons_icon_container"> <img src="https://assets.dev.to/assets/sparkle-heart-5f9bee3767e18deb1bb725290cb151c25234768a0e9a2bd39370c382d02920cf.svg" width="18" height="18"> </span> </span> <span class="aggregate_reactions_counter">1<span class="hidden s:inline"> reaction</span></span> </div> </a> <a href="https://dev.to/gauravchadhry/crossbuild-ui-figma-inspired-expo-react-native-ui-kit-with-instant-cli-setup-3j1f#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center"> Comments 1<span class="hidden s:inline"> comment</span> </a> </div> <div class="crayons-story__save"> <small class="crayons-story__tertiary fs-xs mr-2"> 1 min read </small> <span class="bm-initial"> </span> <span class="bm-success"> </span> </div> </div> </div> </div> </div> </div> ui reactnative mobile webdev Gaurav Singh Wed, 11 Jun 2025 09:24:34 +0000 https://dev.to/gauravchadhry/crossbuild-ui-figma-inspired-expo-react-native-ui-kit-with-instant-cli-setup-3j1f https://dev.to/gauravchadhry/crossbuild-ui-figma-inspired-expo-react-native-ui-kit-with-instant-cli-setup-3j1f <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdowh6ssj6t6ozxh8kgdw.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdowh6ssj6t6ozxh8kgdw.png" alt="Website Preview" width="800" height="438"></a></p> <p>Hey devs! 👋</p> <p>I’ve been building <strong><a href="https://www.crossbuildui.com" rel="noopener noreferrer">Crossbuild UI</a></strong> — a fast, Figma-inspired UI toolkit for <strong>Expo + React Native</strong> apps. It includes open-source <strong>templates</strong>, <strong>themes</strong>, and a powerful <code>cbui-cli</code> to scaffold apps in seconds with built-in theming, structure, and responsive design.</p> <h3> ⚡ Highlights: </h3> <ul> <li>20+ styled components (dark/light mode ready)</li> <li>Real Figma design to code-ready implementation</li> <li>CLI tool: <code>cbui-cli</code> for blazing-fast app setup</li> <li>Expo-optimized project structure</li> <li>Theming system for easy customization</li> </ul> <h3> 🔄 Just Relaunched! </h3> <p>Thanks to your early feedback, I’ve dropped key updates to docs, templates, and starter kits — making the whole setup smoother and faster.</p> <h3> 👥 Join &amp; Contribute: </h3> <p>I'm looking for:</p> <ul> <li>🧑‍💻 Developers</li> <li>🎨 Designers</li> <li>🛡 Moderators &amp; Admins for our Discord</li> </ul> <p>Want to join the journey? DM me or email: <a href="//mailto:support@crossbuildui.com">support@crossbuildui.com</a></p> <h3> 🔗 Links: </h3> <p>🌐 <a href="https://www.crossbuildui.com" rel="noopener noreferrer">Website</a> | ⭐ <a href="https://github.com/crossbuildui/crossbuildui" rel="noopener noreferrer">GitHub</a> | 📚 <a href="https://www.crossbuildui.com/docs" rel="noopener noreferrer">Docs</a> | 💬 <a href="https://discord.gg/QUgPps8hUn" rel="noopener noreferrer">Join Discord</a></p> <blockquote> <p>⚠️ Note: Only the templates and themes are open source — core components are semi-private but fully accessible via the CLI for rapid development.</p> </blockquote> ui reactnative mobile webdev