<!-- googleoff: index -->
⚠️ v4.0 UI Transition Notice - In Process:
The release of Total Launcher v4.0 has introduced significant user interface changes. Please note that this
page does not yet reflect these updates. The new layout paths, folds, and visual maps are currently being
compiled and will be deployed shortly.
Create a Shape Using a See-Through Background
This process is useful for creating or manipulating shapes used anywhere in the launcher, including icons. Icons typically are for just one app or widget. But with this described technique, it is possible to have a see-through shape which holds an icon or other objects.
Create or Obtain the "Invisible" Shape
The procedure to apply the “invisible” image to the shape is shown below. There are 2 sources for that image:
Click here to view the GIMP procedure
With GIMP open, select File > New
Set width to 500 and height to 500 in pixels
Select that same dialog's Advanced Options to open a sub-dialog:
Change Fill to show Transparency and click OK (a checkerboard pattern shows)
The canvas has been created. A shape will be placed on it.
Select the rectangle tool from the tool dialog (or press R)
The Tool Options dialog shows in the left panel
Check Round corners and set the radius to 50
Now use the mouse/cursor to draw a square in the center of the canvas and release it when completed. Do not draw outside of the canvas, as the resulting rounded square will define the outer edge of the object. The shape has been created.
Define the “frosting”: A white block will be added. Its transparent center will extend toward the shape's outer boundaries,
In the Layers panel in the bottom right, add a layer by right-clicking on the existing layer
Select New layer. Click its name and enter Frosted Glass
While the “Frosted Glass” layer is selected, click File > Edit > Fill and in the open dialog set the FG Color to white using the color dialog. Click OK, and the rounded square will be solid white
Define a border of the frost: From the top menu bar, select Select > Shrink, enter 20 (pixels), click OK
Define a gradient effect for the soft border: From the top menu bar, select Select > Feather, enter 30 (pixels), click OK
Now press the keyboard Delete key to see the center become transparent towards the border's edge
If less frost is desired, press Delete again; or more frost is desired press Ctrl+Z
Add a “glass effect” to the lens so that the center is not empty but slightly glassy
With the outer shape selected, then right-click the Frosted Glass layer in the Layers panel (bottom right)
Click Alpha to Selection
In the main menu bar select Layer > New layer and name it Tint
Fill this layer with white (the FG Color should still show white from the previous process)
In the Layers panel, set the Tint layer Opacity level to 15% to make the center appear more like glass is there instead of strict transparency.
Ready to export the file.
Select File > Export as and rename the file (top of screen) to glass_shape.webp (JPGs do not support transparency)
Decide which directory on the device to export the file: directory in the 1st column, then the sub-directory (if desired) in the 2nd column)
Click Export, then Export again.
Process Complete! The PNG/WEBP is ready to place in Total Launcher Resources.
++++
</WRAP>
</WRAP>
</WRAP>
* -or- use the PNG/WEBP image(s) offered below for download at the bottom of this page.
Whichever route is selected results in a reusable glass container for any icon, shape, or widget!
==== Import the PNG/WEBP to Resources ====
Any external image used by Total Launcher must be added to the 'Image Resource' area. If unfamiliar with this, the procedure is here.
Create the Total Launcher Resource Shape for the Transparent PNG/WEBP
Place the desired shape on the page:
In Edit On mode, in the top Page Design menu, tap the + icon
Select Graphic > Image > Default > Shape > Add (+)
In the Add Shape dialog select Shape > Round rectangle and then re-name the Label as “frost”
Tap the Option
icon to open the radius dialog
The default setting is 28, which represents Google's current Material rounded corner for icons. Modifications can be made by direct input or using the slider. Leave it at the default setting. Select OK.
In the Shade Add dialog, where the “frost” shape is now shown, tap “frost” to place it on the page.
The created shape (white rounded rectangle) is now on the page and selected and can be moved by dragging. Move it to any location.
In the Object Design menu (top), tap the Option
icon to open the shape's Edit dialog.
Tap Image > Icon pack and select any desired icon
The shape with the icon is now on the page.
The video's icon had no background. Other icons may have a colored or shaded background or insets. If so, see the next step to “minimize” that.
In the Object Design menu, tap Options to open the Option Edit dialog.
Select Background, which opens Image Resources. Scroll and select the frost image (created in Gimp or Photoshop or downloaded from this page and previously in Image Resources).
The “frost” is added to the shape's background.
If the icon is larger than desired, scale it down (or vice versa). It will not affect the size or the shape of the object (frost).
Tap Options in the Object Design menu and scroll to Margins at the bottom. Tap to open its dialog. Here, the margins are increased (interior borders are moved towards the center), which shrinks the icon.
Tap OK and back out of the editing dialog to the page.
Project completed.
Margin manipulation for an object, called scaling, is helpful. Explore it more fully here.
Image Download
The above procedure creates a shape that places a “clear” image as its background. Either of the images below (Frost or Shadow) could be used on dark-mode or light-mode wallpaper or used as image headers for folders.
Clear Frosted Border
Round Rectantle | Clear Shadowed
Round Rectangle |
 |  |
| Download | Download |
| Summary of Marial Design (Material You v3) Standards for Radii Corners |
| 12 | Medium | cards or grouped lists inside a widget |
| 16 | Large | floating action buttons (FABs): square-ish
or smaller widgets |
28
or
Fully Rounded | Stadium | standard buttons typically ½ the height
(e.g., height = 50, radius is 25: pill shaped) |
Comments & Feedback
Toby Lancer is ready to help! Look for the Quick Help form:
► Desktop: left sidebar located near the bottom for Private to Admin
► Mobile: 3-bar menu at page top.
► Use the Discussion section below to share any experiences and communications with other Total Launcher users.
► Any Registered User can directly update this and any wiki page if desired.
Moderation: To keep the manual clean, all comments are held for appropriateness review. Preview any comment before submitting it. It will not be displayed after submission until it is reviewed. So, please, do not resubmit.
Formatting: If using any code snippets, place them inside code tags (e.g., 'code') using double single quotes (') before and after to keep them readable.
Be Kind: This is a community effort. Please keep feedback constructive and on topic.
~~DISCUSSION~~