Images can be added to your project in two ways. Import to library or dragging images into the Blocs application.

Changing Images

When you place an image Bric into your design or use one of the pre-made Blocs that contains an image, the image will be set to a basic placeholder. To change any image in your design simply double click it or if the image is already selected you can also change it by clicking on the preview thumb from the sidebar inspector options. This will open the Asset Manager, from here you can choose to use either a stock image or one of your own.

Importing Images

There are multiple ways to import images into a project, the easiest way is to simply drag images into the Blocs application window, doing this will add them to the Asset Manager as well as placing them onto your current project page. Alternatively, you can also import images to a project using the keyboard shortcut ⌥+I.

Blocs supports image files up to 5MB in the following file formats: jpg, png and svg. Gif images do not have a file size limit.

Resizing Images

There are multiple ways to resize images on the Blocs canvas. The easiest way is with the image scaling handle located on the side of the selection marker. Left Clicking and dragging this handle will resize the image to the desired size. Alternatively, you can also set the image height and width values using the size input fields located in the sidebar inspector options.

Bloc background image size

Images applied as Bloc backgrounds cannot be resized on canvas, to resize an image used as a Bloc background, first apply a custom class to the Bloc and then set the custom classes background image height and width values using the class editor.

Updated on 28th January 2019

Was this article helpful?

Related Articles