--- title: Embed Checkout Kit description: >- Embed Shopify checkout in your mobile app with Checkout Kit. Supports iOS, Android, and React Native. source_url: html: 'https://shopify.dev/docs/storefronts/mobile/checkout-kit' md: 'https://shopify.dev/docs/storefronts/mobile/checkout-kit.md' --- # Embed Checkout Kit Checkout Kit is an open-source SDK for [Swift](https://github.com/Shopify/checkout-sheet-kit-swift), [Android](https://github.com/Shopify/checkout-sheet-kit-android), and [React Native](https://github.com/Shopify/checkout-sheet-kit-react-native) that embeds Shopify checkout inside your mobile app. Pass a `checkoutUrl`, and buyers get the same checkout they see on the web, with your store's branding, payment methods, and extensions. Shopify processes the payment, applies tax and regulatory rules, and creates the order. *** ## Quick start Install the SDK, pass a `checkoutUrl`, and Checkout Kit presents your store's checkout in a native sheet over your app: ## Install and present checkout ##### Swift ```swift // Add to Package.swift: // .package(url: "https://github.com/Shopify/checkout-sheet-kit-swift", from: "3.0.0") import ShopifyCheckoutSheetKit ShopifyCheckoutSheetKit.present(checkout: checkoutUrl, from: self, delegate: self) ``` ##### Kotlin ```kotlin // Add to build.gradle.kts: // implementation("com.shopify:checkout-sheet-kit:3.0.0") import com.shopify.checkoutsheetkit.ShopifyCheckoutSheetKit ShopifyCheckoutSheetKit.present(checkoutUrl, this, checkoutEventProcessor) ``` ##### React Native ```javascript // npm install @shopify/checkout-sheet-kit import { useShopifyCheckoutSheet } from '@shopify/checkout-sheet-kit'; const shopifyCheckout = useShopifyCheckoutSheet(); shopifyCheckout.present(checkoutUrl); ``` For event handling, see [Monitor checkout lifecycle](https://shopify.dev/docs/storefronts/mobile/checkout-kit/monitor-checkout-lifecycle). For branding options, see [Configure checkout branding](https://shopify.dev/docs/storefronts/mobile/checkout-kit/configuration). *** ## How it works Checkout Kit takes a `checkoutUrl` and presents checkout inside your app. A `checkoutUrl` comes from either a [`cartCreate` mutation](https://shopify.dev/docs/storefronts/mobile/build-mobile-storefront#get-a-checkout-url) or a [cart permalink](https://shopify.dev/docs/apps/build/checkout/create-cart-permalinks) that redirects to checkout. 1. Get a `checkoutUrl` and pass it to Checkout Kit. 2. Checkout Kit presents your store's checkout inside the app. 3. The buyer enters shipping and payment details. 4. Shopify processes the payment and creates the order. 5. Checkout Kit fires callbacks when checkout completes, fails, or the buyer cancels. Checkout Kit supports iOS, Android, and React Native: | Platform | SDK | Min version | | - | - | - | | iOS | [ShopifyCheckoutSheetKit](https://github.com/Shopify/checkout-sheet-kit-swift) | iOS 13.0, Swift 5.7 | | Android | [ShopifyCheckoutSheetKit](https://github.com/Shopify/checkout-sheet-kit-android) | Android SDK 23, JDK 17 | | React Native | [@shopify/checkout-sheet-kit](https://github.com/Shopify/checkout-sheet-kit-react-native) | React Native 0.70 | *** ## Checkout Kit features After you've embedded Checkout Kit in your app, you can customize and optimize the checkout experience: * **[Preload checkout](https://shopify.dev/docs/storefronts/mobile/checkout-kit/preloading)**: Fetch checkout in the background so it opens immediately when the buyer is ready to pay. * **[Monitor checkout lifecycle](https://shopify.dev/docs/storefronts/mobile/checkout-kit/monitor-checkout-lifecycle)**: Respond when checkout completes, fails, or the buyer cancels. Use callbacks to update your UI and reset cart state. * **[Authenticate checkouts](https://shopify.dev/docs/storefronts/mobile/checkout-kit/authenticate-checkouts)**: Sign buyers in to prefill checkout with saved addresses and payment methods. * **[Privacy compliance](https://shopify.dev/docs/storefronts/mobile/checkout-kit/privacy-compliance)**: Pass General Data Protection Regulation (GDPR), California Consumer Privacy Act (CCPA), and App Tracking Transparency (ATT) consent to Shopify so the right tracking rules apply during checkout. *** ## Store customizations in checkout Checkout Kit renders the same checkout that buyers see on the web: * **[Branding](https://shopify.dev/docs/storefronts/mobile/checkout-kit/configuration)**: Match your store's colors, logos, and fonts. Pick the `.automatic` theme for light and dark mode support, or `.web` to pull your store's custom branding from the Shopify admin. * **[UI extensions](https://shopify.dev/docs/api/checkout-ui-extensions/latest)**: Add custom fields, banners, and logic with checkout UI extensions. * **[Shopify Functions](https://shopify.dev/docs/apps/build/functions)**: Run discounts, payment customizations, and delivery rules at checkout. * **[Payment methods](https://shopify.dev/docs/apps/build/payments)**: Accept all configured payment providers, including Shop Pay and Apple Pay. **ShopifyPlus:** Checkout UI extensions and checkout branding require [Shopify Plus](https://help.shopify.com/en/manual/intro-to-shopify/pricing-plans/plans-features/shopify-plus-plan). ![Three mobile screens showing a Shopify checkout with store branding, Shop Pay, and order confirmation.](https://shopify.dev/assets/assets/images/custom-storefronts/checkout-sheet-kit/csk-branding-options-0G3j9Uza.png) *** ## Next steps [Preload checkout\ \ ](https://shopify.dev/docs/storefronts/mobile/checkout-kit/preloading) [Reduce loading time by fetching checkout before the buyer is ready to pay.](https://shopify.dev/docs/storefronts/mobile/checkout-kit/preloading) [Monitor checkout lifecycle\ \ ](https://shopify.dev/docs/storefronts/mobile/checkout-kit/monitor-checkout-lifecycle) [Respond to checkout events in your app and track analytics with web pixels.](https://shopify.dev/docs/storefronts/mobile/checkout-kit/monitor-checkout-lifecycle) [Accelerated checkouts\ \ ](https://shopify.dev/docs/storefronts/mobile/checkout-kit/accelerated-checkouts-overview) [Add Shop Pay and Apple Pay buttons for one-tap purchases on product and cart pages.](https://shopify.dev/docs/storefronts/mobile/checkout-kit/accelerated-checkouts-overview) ***