Images – pictures and icons in nexxcite¶
An image definition holds a picture you upload once and use in many places – a logo, a product photo, an illustration on a dashboard. This chapter describes how images are uploaded and stored, where they are used, and how definitions get their own icon.
It is intended for administrators who design the look of an application.
1. Images at a glance¶
| Image | Icon | |
|---|---|---|
| What it is | An uploaded picture file (PNG, JPEG, SVG, …) | A single sign of an icon font |
| Defined in | Admin Studio → Design → Images | Admin Studio → Design → Icon Fonts (see Icon fonts) |
| Scales | as a picture | like text, sharp at every size |
| Typical use | Logos, photos, illustrations | Buttons, app bar entries, badges, the icons of definitions |
Where pictures and icons are chosen:
| Place | Setting |
|---|---|
| Image and button blocks, badges, app bar items, tabs | An image expression – it returns an image, an icon of an icon font, an external picture or a Microsoft Entra profile picture (see Expressions) |
| Role | "Logo (Light Mode)", "Logo (Dark Mode)" – an image that replaces the nexxcite logo in the top app bar |
| Every definition | "Icon" in the header of its editor (section 5) |
Images are managed with the permissions "Open Image Manager", "Add Image", "Edit Image" and "Delete Image" (granted by "System Administrator").
2. Before you start: the file storage¶
nexxcite does not store uploaded pictures on its own servers. They are kept in Azure Blob Storage or an S3-compatible storage, set in the global settings under "Image File Provider" and "Image File Provider Credentials" (see Global settings).
Without both settings no picture can be uploaded. The image editor then shows "No file provider is configured. Please configure an Image File Provider and Credentials in the Global Settings."
3. Uploading an image¶
- Open Admin Studio → Design → Images and create an image.
- Give it a "Display Name" – it is the name you pick it by later.
- Click "Upload image" and choose the file.
- Save with "Save & Close".
| Item | Value |
|---|---|
| Accepted file types | .png, .jpg, .jpeg, .gif, .webp, .bmp, .svg, .ico |
| Largest file | 50 MB |
| Files per image | one |
The editor shows the file name, the type and the size of the uploaded file and a preview. Pictures larger than 2 MB are not previewed before saving ("The image is too large to be previewed here."); after saving, the preview is loaded from the storage.
"Replace image" uploads a new file for the same image definition. Everything that uses the image shows the new picture – there is nothing to change elsewhere.
"Remove image" removes the file. The image definition stays and shows "No image has been uploaded yet." The file itself is deleted from the storage when the definition is saved; closing the editor without saving keeps it.
4. How images are delivered¶
- Images are delivered by nexxcite under
/api/images/<image id>to signed-in users only. They cannot be used on the sign-in page or in e-mails sent to people without a nexxcite account. - Browsers keep an image in their cache. After a replacement the address changes, so users see the new picture without clearing their cache.
5. Icons of definitions¶
Every editor has an "Icon" in its header: the picture a definition is shown with in the Admin Studio, in the management views, in the tabs and in the spotlight search. The picker lists the uploaded images first and the icons of the icon fonts behind them – including the built-in Material Symbols icons – and can be searched.
Without a chosen icon, a definition shows the standard icon of its kind (form, action, entity, …). Choosing an icon is optional; it helps to recognise important definitions at a glance, for example the main entities of an application.
6. Examples¶
A company logo per role. Upload "Logo light" and "Logo dark" as images. In the role "Partner portal", set "Logo (Light Mode)" to "Logo light" and "Logo (Dark Mode)" to "Logo dark". If only one of the two is set, it is used for both colour schemes.
A product picture on a form. Store the picture as an image, then use an image block with an image expression of the source "Image". To show a different picture per record, let the expression choose the image depending on a field.
7. Limitations¶
- One file per image definition. Several sizes of the same picture are several image definitions.
- A file larger than 50 MB is not uploaded, and the editor does not show a message for it.
- Images are not versioned. A replaced file cannot be restored from nexxcite.
- Images are only available to signed-in users.