Start Sleek Capture App

Save *.png
?

Control Panel

Preview
Active Layer:
Layer Opacity
100





x

x

 + 
x

Adjust Layer Order (z axis)





Horizontal Image Orientation
Vertical Image Orientation
S
Colour Opacity
100

Jusitfy
Font
Google
Size
20

Weight


Deg
Border Radius % px
0
Border Size
0
Major Devisions
Minor Devisions

 + 
x
Logo Opacity
100

Welcome To The Capture App


This App is a web app that creates images for use on various social media sites and print media.

Preview

Generates a png image on top of the editing screen. Right click to save the file to your computer.

Edit

Returns the screen to editting mode so that changes can be made.

Active Layer

This app uses the concept of "layers". A layer holds text or images or shapes in a distinct area. Each layer is editable in many ways. They can also be stacked and their covering of each other can be shifted. As well as their opacity and blending. Layers add a variety of powerful editing options by compartmentalizing the work. Active Layer shows which layer is active at the moment. Any configuration settings will affect the active layer.

Clicking on the words "Active Layer" will focus the cursor on an editable layer.

Edit Layer Name

This button will open the editing bar for layers. Typing in a name in the text field and then clicking on the checkmark will change the name of any user created layer. The "placeholder" text will be the new layer name, as well as the tooltip that appears while the mouse is hovered.

Show / Hide Layer

Hides or shows any layer, including the five standard layers. A layer that is hidden has the selection option in the "Active Layer" bar greyed out.

Drop Down Menu

The drop menu in the "Active Layers" bar will display a list of all layers. Selecting a layer will make that layer the "Active Layer". Any edits will be applied to the "Active Layer".

Canvas Ratio Options

Begin by choosing a canvas option. This will optimize thet size and aspect ratio of your project to make the best image. This can be editable after you begin your project but default and user created layers will not auto adjust position.

Layer Control Options

This app uses the concept of "layers". Each layer that is not a "shape" has the ability to hold text. There are five standard indestructable layers. However all layers can be individually hidden from view if they are unwanted.

The "Backgound" layer is always on the bottom. All other layers can be moved to the forefront or rearfront by using the "Adjust Layer Order" controls.

Create Layer

Creates a new layer and gives it an automatic name starting with "Layer" and then a number. Each layer that is created has a higher number. A newly created layer is automatically given the top layer position. This can be edited. The name can also be edited.

Delete Layer

Deletes any user created layer.

Visibility

Hides or shows any layer, including the five standard layers. A layer that is hidden has the selection option in the "Active Layer" bar greyed out.

Duplicate Layer

Copy the layer you currently have as the active layer and place it in the top left corner.

Layer Width x Layer Height

Displays the current layer width and height. Editing this number and pressing the cross arrows () will set the width and height to the number specified.

Apply Dimensions

This button will apply dimensions edited in the immediately preceding input boxes.

Move Flush Arrows

These arrows will move the active layer to be flush with the side of the canvas the arrow points to.

The positions of the arrows on the left side do not negate the position of the arrows on the right side. If you desire to centre a layer, you can press both middle arrow buttons.

Layer Position

Displays the position of the active layer. Editing these boxes will also make it possible to change the position of the active layer by pressing the "Apply Position" arrows ().

Adjust Layer Order

Layer Opacity

Will make the layer see-through by percentage of the opacity bar. Fully to the right is opaque; this is the default setting.

Layer Border Options

Border Radius

Border radius will round the edges of the active layer. The effect may not be seen if there is no content in the layer. The "px" button will round the edges by the amount of pixels on the border slider; causing a filet effect. The "%" button will round the edges from the centre of each side and will blend vertical and horizontal sides independantly.

Border Size

Border size will change the thickness of a layer's border, provided it is not a "shape". The default colour is grey; but this can be edited in the HSL tab.

Shape Options

Shape options buttons produce shapes that do not include text editing options. These shapes can be used to draw elements on the drawing plane.

Grid

The grid button toggles the visibility of the aligment grid. Elements can be placed using the grid as a guide. The grid does not render in the output plane. It is not intended to be used as a visual element.

Mask

The circle mask button toggles the visibility of the circle mask. The circle mask does not render in the output plane. It is intended to be used to help determine the boundary of Instagam circular thumbnails.

Left Qutoes / Right Quotes

These buttons create a quote shape. All quote shapes are automatically created with a title starting with "shape" and ending with a number. All quote shapes share the same text colour and text-shadow colour but may have different background colours and other modifications.

Polygon

The polygon button creates a polygon with the number of sides indicated to it's right. The colour of the polygon can be changed with its text colour. Polygons can be resized.

Square Aspect Ratio

The square aspect ratio button takes the average of the width and height of the polygon that is highlighted and makes the sides equal. This is useful for showing inscribed polygons by setting the radius to 100% and choosing a background colour for that layer.

Text Options

Text options offer a diverse set of text features for customizing your layers with editabe text.

Save

Saves the text options in one location for easy portability to other layers or for recalling work. When save is clicked, the drop down menu to the right is populated with an automatic name that can be edited.

Drop Down Menu

Contains all of the user saved text option profiles.

Apply

Apply the saved profile to the current active layer.

Delete

Delete saved profile currently displayed on the drop down menu.

Edit

Toggles display of editing field. Editing field will change the name of currently displayed user saved text profile once checkmark is clicked. Once the checkmark is clicked, the field will become blank and disappear.