Drag and position objects on a live canvas, with precision controls.
All images and data are embedded directly — no external files required.
Save and reload individual objects for reuse across projects.
Right click on the canvas background and select the page brackground properties.
You can select a background color or upload an image.
Images will be stretched to fill the screen so it is best to use 16:9 images.
Use your mouse to draw a rectangle on the canvas.
Click on an object to select it.
Further clicks will toggle between rotate and resize mode.
Use the round corner handles to rotate the object.
You can also set the precise rotation value in the general properties panel.
Right click on an object and select property category.
A common styling method is to use an object as a pane containing text on a backgound.
In the general properties section you can adjust the roundness of the corners.
Use the shadow properties section to lift these panes of the page for beautiful effects.
There is an adjustment for transparency in both the foreground and background properties.
Adjusting these values can create very stylish effects.
Select foreground properties and use the text editor.
Select the font to use for the object.
You can use custom google fonts for incredible styles.
Note : The foreground of an object can be either an image or text but not both.
Text shadows can be important to make text stand out against the background.
There are 3 shadow options in the foreground properties.
These are..
Top left white for dark text.
Bottom right black for light text.
Distant blurred black for lift off page effect.
How these look will vary depending on text size and background tones.
Select foreground properties and change to image. See note above.
By using a gif or png image with a transparent background and setting the background transparency to 1, the object can be just the image. itself.
In the text editor you can select any text then use the menu options for links,style and color.
Use the object link in the foreground properties to create a link for the whole object.
In the general category you will find a bounce on click option so you can create great clickable buttons etc.
An object can be made completely invisible using the transparency setting and just provide a way to position a clickable link on a background image.
The basic size of text is set in the foreground properties however you can adjust this to small, large and larger in the text editor.
Text will by default start top left in an object however it can be vertically centered using the vcenter checkbox in foreground properties.
Horizontal positioning is done in the text editor.
Use the margin setting to keep the text away rom the edges of the object.
Use the layer property in general properties.
A higher number will be on top.
The default is zero.
Negative numbers will work however they may disable link functionality.
Hold the shift key down and select an area containing the objects or click on each object while holding shift key down.
Keep holding the shift key while repositioning objects.
Group alignment buttons will become active once a group is selected.
When you click the save page button you will be prompted to name your page and it will be downloaded to your download folder.
Modern browser security makes your download folder the only option available.
We suggest that you create a PageMint Studio folder on your computer with a /pages folder and a /objects folder to move your creations into.
By selecting Load Page you can navigate to your /pages folder and when a page is loaded all your objects will be there for you to continue editing.
A selected object or group of objects can be saved in the same fashion as pages and can be reloaded for use on other pages.
Note : Saved pages use the .html extension and objects use .htm. This helps to distinguish between them and allows them to be viewed directly in a browser.
PageMint Studio creates single full screen pages that do not scroll however we are working on a way to join your pages together to create a vertical and or horizontal scrolling grid.