How To: Create a "Card" or "Icon" with Shadow Effect

➡️ Two shadows will be created. One for a “card” or pallet used in current Android design and one for a “button lift” to give a small object or icon a floating effect from the page.

• Create the 1st Shadow (Card Shadow)

1. In Edit mode (pinch in) select Main menu > Launcher Options > Resources > Shadow
2. Tap the “Add” icon
3. For “Label” enter Soft_Card_Shadow
4. “Shadow color”: Tap the box area and select “Color”. For ARGB enter 46000000 (Black with ~25% opacity)
5. The “color box” for “OK” will change. Tap it to return to the “Shadow Add” dialog.
6. For “Shadow radius” enter 32
7. For “Offset X” enter 0
8. For “Offset Y” enter 10
9. Tap OK to return to the Shadow dialog

• Create the 2nd Shadow (Button Lift)

1. Tap the “Add” icon
2. For “Label” enter Button_Lift_Shadow
3. “Shadow color”: Tap the box area and select “Color”. For ARGB enter 5A000000 (Black with ~35% opacity)
4. The “color box” for “OK” will change. Tap it to return to the “Shadow Add” dialog.
5. For “Shadow radius” enter 18
6. For “Offset X” enter 0
7. For “Offset Y” enter 6
8. Tap OK to return to the Resource dialog

• Create the Card Shape (used for main panels and widgets)

1. Back out to the Resources dialog and select Shape
2. Tap the Add icon
3. For “Shape” select Round rectangle
4. Tap its Option icon and for its radius set 28
5. “Color1”: Tap the icon, select “Color”
6. For ARGB enter 3CFFFFFF (Note: The 1st 2 digits represent Alpha. 3C is ~60% opacity for a frosted look)
7. Tap OK
8. “Border width” set at 1, do not tap OK yet
9. “Border color”: tap and select “Color” and for ARGB enter 26FFFFFF
10. Label: enter Shadow_Card and tap OK to return to the Shape dialog

• Create the Button Shape (used for icons and taps)

1. Still in the Shape dialog, tap the Add icon
2. For “Shape” select Round rectangle
3. Tap its Option icon and for its radius set 20
4. “Color 1”: Tap the icon, select “Color”
5. For ARGB enter 50FFFFFF (represents Alpha of ~80% for a slightly more solid button)
6. The “color box” for “OK” will change. Tap it to return to the “Shadow Add” dialog.
7. “Border width” will remain at 0 (not used)
8. Label: enter Shadow_Button and tap OK to return to the main menu

• Apply to a “floating” app icon

1. In Edit On mode tap the Add icon in the Page Design Menu
2. Select Graphic > Image > Default > Icon packs
3. Scroll or use the search dialog to select the desired icon. Tap to select it.
4. The App icon is on the page and selected. In the Object Design menu tap the “Option” icon
5. In the main Option Edit dialog, tap “Background” > select «“Shape”» > Shadow_Button
6. In the main Option Edit dialog (do NOT tap Background again), scroll to find “Shadow” > select Button_Lift_Shadow
7. Tap “Margins” and set to 14 for all 4 sides. Tap OK.

• Create a visual “Shadow Card” panel on the page

1. In Edit On mode tap the Add icon in the Page Design Menu
2. Select Graphic > Shape
3. The default shape is placed on the page. In the Object Design menu tap the “Option” icon
4. In the main Option Edit dialog, tap “Shape” > select Glass_Card
5. In the main Option Edit dialog, scroll to find “Shadow” > select Soft_Card_Shadow
6. Tap OK.
7. Resize this panel to your desired dimensions.
8. Note: Ensure this panel is layered behind your icons by tapping its option menu and selecting “Send to back”.

current Here is a corrected, procedure-driven implementation of that recipe to achieve the target visual effect :

This procedure creates the “glass” panels themselves by defining the shape, radius, and appropriate level of partial transparency. Total Launcher does not present transparency as a percentage; it uses the Alpha component of a color channel (A = 0–255), with A=0 being fully transparent and A=255 being fully opaque. When manually typing colors, the format is #AARRGGBB (Alpha comes first).

1. Shape: Rectangle.
   1. Radius: 👉 28.
   2. Fill: Solid white color (R=255, G=255, B=255).
   3. Alpha (A): For this “light glass” effect , target partial transparency with an Alpha value of 45–60 (approximately 18–25% visual opacity).
   4. Example ARGB: #3CFFFFFF (A=60) or lighter #2DFFFFFF (A=45).
   5. Border (Optional): Add a subtle white border with a width of 1 and a very subtle Alpha value of 30–40 (around 20% visual opacity). Example subtle border ARGB: #26FFFFFF.

1. Duplicate Glass Card, then make changes.
2. Radius: Set to 20.
3. Fill Alpha: Target a slightly stronger fill with an Alpha value of 65–85 (approximately 25–32% visual opacity). A “simple memory trick” suggests targeting A ≈ 80.
   1. Example Button ARGB: #50FFFFFF (A=80).

The core targeting effect is making objects appear to float, which is achieved through specific shadow parameters. Total Launcher requires specific ARGB values for shadow color and uses standard terminology like shadow radius and offset.

• Crucial Beginner Mistake to Avoid: Avoid huge blur values, as they kill performance; you should stay under 40.
• Color Setting Note: Total Launcher's standard user interface handles shadow color through the standard shadow dialog, where parameters include label, shadow color, shadow radius, and shadow offset X/Y.

1. Soft Card Shadow (Shadow #1)
   1. Blur/Shadow Radius: Set to 32.
   2. Offset Y: Set to 10.
   3. Offset X: Set to 0.
   4. Color Opacity Target: The recipe targets 25% visual opacity with an Alpha value of 60–70.
   5. Target Shadow Color: Black (R=0, G=0, B=0) with the example ARGB #46000000. (Which uses an Alpha of 70) .
2. Button Lift Shadow (Shadow #2 for Icons)
   1. Blur/Shadow Radius: Set to 18.
   2. Offset Y: Set to 6.
   3. Offset X: Set to 0.
   4. Color Opacity Target: For this stronger effect, target 35% opacity with an Alpha value of 80–100.
   5. Target Shadow Color: Stronger black with example ARGB #5A000000. (Which uses an Alpha of 90) .

• Final Implementation: Once shapes and shadows are created and assigned within the Total Launcher user interface, the target combinations should be applied to objects:
• Cards use: Glass Card shape combined with the Soft Card Shadow.
• Buttons and Icons use: Glass Button shape combined with the Button Lift Shadow.

TIP: Targeting the “Proper” ShadowThere is no single “correct” shadow setting, but there IS a correct target: Contrast. To make an object feel like it belongs in its environment, look for contrast in Value (light vs. dark), Temperature (warm vs. cool), and Saturation (vivid vs. muted).

Recommended Design PalettesUse these ARGB values and technical offsets to build your Shape Resource before assigning it to the Image slot.

⚠️ Technical Requirement: The Margin Formula

Every shadow exists within a strict rectangular bounding box. If a shadow casts outside this box, it is immediately clipped (cut off flat). To prevent this, you must use the Margins input in the Object Edit menu.

The Formula: (Apply only to the quadrants where the offset is directed). Required Margin ≥ (Shadow Radius ➕ Shadow Offset)

Margin Requirements for Scenarios

Implementation Workflow - Build the Resource: Create a new Shape Resource. Input the Fill, Shadow ARGB, Radius, and Offsets from the table above. - Assign the Image: Open the Object Edit menu and assign your custom shape to the Image slot. - Set the Background: Assign your desired surface color or image to the Background slot. - Apply Margins: Immediately navigate to the Margins section at the bottom of the Edit menu. Enter the calculated Min. Margin for the Right and Bottom fields to ensure the shadow renders fully without clipping.

💡 TIP: The Shadow TargetThere is no “correct” shadow setting, but there IS a correct target: Contrast. Use Value for height, Temperature for realism (cool shadows for warm objects), and Saturation for clean, modern edges. Always ensure your Object Margins $\ge$ Radius + Offset to prevent the “flat-edge” clipping bug

The Single-Object Procedure ​To achieve the exact result in your image (a white card with a border and shadow) using only one Graphic Object, configure it like this: ​^ Menu Level ^ Property ^ Value / Setting ^ Technical Reason ^