← Onboarding

iTranslate Translator

Mosaic S.r.l. · Productivity · $1M/mo · 100.3K downloads · ★ 4.7

App Store ↗

Screens24

8Onboarding

Colors

  • #F0F5FABackground Cloud Blue · Main canvas background
  • #1C1C1EDeep Charcoal Title · Feature title headline
  • #0D99FFPrimary Action Blue · CTA button fill · Active carousel indicator pill
  • #B5D9F8Inactive Dot Blue · Inactive carousel indicator dots
  • #1C1C1EMockup Device Bezel · Smartphone hardware frame
  • #FFFFFFWhite Canvas · Card background inside phone mockup · CTA button label

Type

  • Feature HeadlineSF Pro Display · 72px · 800 · #1C1C1E
  • Action Button LabelSF Pro Text · 42px · 600 · #FFFFFF
  • Mockup In-App ContentSF Pro Text · 28px · 600 · #1C1C1E

Elements

  • Phone Mockup Showcase · graphic_mockup

    Centered in the upper 55% of the screen, realistic iPhone rendering cut off at the bottom with a gentle fade. · Black bezel smartphone displaying active iTranslate translation interface, subtle drop shadow.

  • Page Indicator Dots · pagination_indicator

    Horizontally centered beneath the Continue button, 5 items. · First dot is a rounded bar/pill in blue, remaining 4 are circular light sky-blue dots.

  • Continue Button · button

    Bottom-pinned, 142 px height, standard 68 px lateral inset. · Solid bright blue fill, rounded corners.

Layout

Feature showcase carousel layout: prominent device mockup previewing translation features at top, two-line bold title in the lower third, primary action button, and carousel pagination dots at the very bottom.

Notes

Pagination indicator positioned underneath the main CTA button rather than above it.

Store