Title Element
The Title element lets you add prominent text to your screenβlike a page heading or section title. This is usually the first thing your users see on the screen, so itβs important for setting the tone and guiding them through the app.
Twinr gives you two simple tabs to control everything:
Content Tab β where you type your text.
Settings Tab β where you style and adjust how it looks and feels.
Letβs walk through both tabs. π
Content Tab
βοΈ Add Your Text
Title Field: This is where you enter the main text.
Example: This is random text
Settings Tab
Hereβs what you can customize:
π¨ Design Your Title
1. Text Style
Set to Custom for full control over size, weight, and color.
2. Font Size & Weight
Font Size: Choose how big your title should look (e.g., 20px).
Font Weight: Decide how thick the text appears (e.g., Bold 700).
3. Color
Pick from predefined styles like Heading or set a Custom Color using a HEX code.
Example: #171D1B is a bold black used for headings.
4. Text Alignment
Align the text to Left, Center, or Right.
π Margin Settings
You can also add space (padding) around the title:
Top / Bottom / Left / Right margins can be adjusted using sliders.
Use the π icon to link margins for symmetry.
Default spacing is 20px on all sides.
ποΈ Visibility Settings
The Visibility section helps you control who can see the element and where it appears. This gives you flexibility to show different content to different users or on specific devices.
You can adjust visibility based on:
1. Platform
Choose which platform the element should be visible on:
All (default)
Android
iOS
2. Device
Control which device types will display this element:
All (default)
Mobile
Tablet & iPad
3. User
Target visibility by user type:
All (default)
Guest Users (not logged in)
Logged-in Users
π Use Case Example:
Want to show a βWelcome Back!β title only to users who are signed in?
Set User to Logged-in Users.
π± How It Looks
As you update the content and settings, the preview in the center shows exactly how your app will look to users. No guesswork needed!
π Summary
Content Tab
Type your title text
Settings Tab
Customize font, color, alignment, and spacing
Live Preview
Instantly see changes on your app screen or look at preview app
Last updated
Was this helpful?