Skip to main content

Managing Assets

"Assets" in Typograph covers two things, both scoped to a project:

  • Media — images and other visual assets used by the project's templates
  • Fonts — font files used by the project's templates

Both live inside a project — there is no organization-wide or team-wide "asset library". This keeps templates self-contained and portable: everything a template needs is available within the same project.

  1. Pick an organization, team, and project.
  2. Open the Media tab or Fonts tab inside the project.

Uploading Files​

Every tab of a project takes files, and each file goes where it belongs: a PDF, ZIP or JSON becomes a template, an image goes to Media, a font to Fonts.

FileUp to
Image75 MB (an SVG 25 MB)
Font, ZIP or PDF50 MB
JSON5 MB

  • Drag files from your computer anywhere onto the project page. While you drag, the page says which project the files go to. Let go to upload.

    A project page while files are dragged over it: the page is dimmed, with the message Drop to upload to Spring campaign, and below it that a PDF, ZIP or JSON becomes a template, images go to Media and fonts to Fonts, and how large each kind of file may be

  • Or choose them: click New template and choose Upload files in the Gallery, or use the upload button on an empty Media or Fonts tab.

While files upload, a panel at the bottom right shows each one with its progress, then Processing… while Typograph prepares it. A file that uploaded leaves the panel; one that failed stays with the reason, until you remove it with ×. When the connection dropped or the server did not answer, the row also has Retry: it uploads the same file again. A file that is too large or of a kind Typograph does not take has no Retry: the reason says what to change. Only people who can edit the project can upload to it.

The Uploads panel at the bottom right of the page, with the file spring-poster-photo.png of 0.2 MB being processed

Uploading Media​

  1. Open the project's Media tab.
  2. Drag images onto the page, or click Upload media on an empty tab and select them. See Uploading Files.

What Typograph Keeps of an Image​

An uploaded image is kept exactly as you uploaded it, the original. Next to it, Typograph makes the versions the platform works with:

  • a print version, the one your designs are printed and exported with
  • a screen version and a thumbnail, sized for the Editor and the Portal and sharp on high-resolution screens

An image counts toward your organization's storage at its largest version: the original or the print version, whichever is larger, which for a photo is usually the original. The screen version and the thumbnail do not count: see Subscription & Usage.

Supported Image Formats​

JPEG (jpg, jpeg), PNG, GIF, SVG, WebP, TIFF (tif, tiff), BMP, Photoshop (psd), Illustrator (ai) and EPS. The extension may be in upper or lower case: a camera's PHOTO.JPG uploads like photo.jpg. Large Photoshop documents (psb) are not supported; save them as psd or tif first.

Uploading Fonts​

  1. Open the project's Fonts tab.
  2. Drag a font file onto the page, or click Upload font on an empty tab. See Uploading Files.
  3. Fonts are made available to all templates inside the project.

Each font in the list shows its size next to its name and designer: what it takes of your organization's storage.

Supported Font Formats​

TTF, OTF, WOFF, WOFF2 (and EOT on input-only via the Converter). TTF/OTF are typical for design workflows; WOFF2 is the most efficient for web delivery.

Managing Uploaded Files​

Both Media and Fonts support the same actions from their list view:

ActionWhat it does
Tags (media only)Adds and removes the file's tags, see Tagging Media
DownloadDownloads the file as it was uploaded
RenameChanges the file's display name
MoveMoves the file to a different project — pick the destination project. It then belongs to that project and leaves the original one's list
Move to trashMoves the file to the Trash, after you confirm. Anyone who can edit the project can restore it from there for 30 days; after that it is deleted for good

Moving a File to the Trash​

  1. Open the file's ⋮ menu and choose Move to trash.

    The menu of the media file Portrait Mark, with Tags, Download, Rename, Move and Move to trash

  2. Confirm with Move to trash. Cancel leaves the file where it is.

    The Move media to trash? dialog, saying the media file will move to the trash and that anyone who can edit the project can still restore it from there, with the buttons Move to trash and Cancel

  3. The file leaves the list, and a message says Media moved to trash (for a font: Font moved to trash).

    The message Media moved to trash

To get a file back, open Trash and restore it: it returns to the project's Media or Fonts tab.

Viewing and Downloading Media​

Click a media card to see the image larger. It opens fitted to the window:

The enlarged media file Portrait Lisa, with WEBP, 960 × 1440 px, 250.5KB and Uploaded Nov 1 under its name, fitted to the window at 44%, with the zoom out and zoom in buttons around the zoom level at the bottom left, and Download and Close at the bottom right
  • Under its name you see what kind of file it is (such as JPEG or PNG), its size in pixels for an image (such as 1200 × 700 px), how large the uploaded file is, and the day it was uploaded. A drawing (SVG, AI, EPS or PDF) has no size in pixels, as it stays sharp at any size.
  • Zoom with the + and − buttons or keys, with Ctrl (Cmd on a Mac) and the scroll wheel, or by pinching on a trackpad. Double-click to zoom in on a spot, and again to fit the image back. The button between them shows how far you are zoomed in; click it, or press 0, to fit the image to the window again.
  • Move around a zoomed image by dragging it, or with the scroll bars.
  • Download saves the file as it was uploaded, under its name in the portal.

Download is also in each media file's ⋮ menu. Media uploaded before Typograph kept originals downloads as the file the editor prints with.

Finding Media​

Searching, sorting and tags sit behind Search and filter, at the right of the tabs, so the media grid starts right below them. Click it to open the panel, click it again to close it. While a filter is on, the button shows how many filters are on, also with the panel closed.

The tabs Templates, Media, Fonts, Clips and Forms with Media chosen, the button Search and filter at the right, and below it the media grid with Spring illustration, Star shape and Flower shape

In the panel:

  • Search by name keeps the media whose name contains what you type.
  • Sort puts them in order: newest first (the default), oldest first, by name, or largest first.
  • Tags: once the project's media have tags, each tag is a button with the number of media it is on. Click one to show only those media, click it again to drop it. Without a tag, the first button, shows the media nobody has tagged yet; choosing it drops the chosen tags, and choosing a tag drops it. A project with many tags shows its most used ones and the ones you chose; More tags shows them all.
Search and filter opened, its count at 2: Search by name and Newest first, then Without a tag and the tags Shapes and Spring campaign, both chosen. Below them 3 media files, Any selected tag chosen beside All selected tags, and Clear filters. The grid shows Spring illustration, Star shape and Flower shape with their tags

Once a filter is on, the panel says how many media files it found. With two tags or more chosen, pick what you are after: All selected tags shows media with every tag (the default), Any selected tag media with at least one. Clear filters shows all media again. On a phone the tags sit in one row you swipe sideways. The filter is in the page's address, so a link to it opens the same selection, with the panel open.

Close the panel while a filter is on and one line above the grid keeps saying what you see: how many media files, which filters, and Clear filters. A file you upload that does not match the filter does not show until you clear it.

Search and filter closed, its count at 2. Above the grid: 3 media files, Filtered by Shapes, Spring campaign, and Clear filters. The grid shows Spring illustration, Star shape and Flower shape

Tagging Media​

Tags are words you give media to find them again: a client, a campaign, Logos, Print only. Each project has its own tags, and a tag you made once is there to reuse on every media file of the project.

  1. Open the media file's ⋮ menu and choose Tags.

    The Media tags dialog of Portrait Mark, with its tags People and Spring campaign, each with an x to remove it, the field Add a tag with the button Add, and Done

  2. Type a tag and click Add. While you type, the project's tags are suggested: pick one to reuse it, or type a new one. Capitals and spaces do not make a different tag: logos is the same tag as Logos.

  3. To take a tag off, click the × next to it.

  4. Click Done. The card shows its first two tags, and how many more it has.

Anyone who can edit the project can tag its media; everyone who can see the media sees its tags. A media file holds up to 20 tags. A file you move to another project takes its tags along, and a file in the trash keeps them.

Using Assets in a Template​

Inside the Editor:

  • Media — drag an image from the media panel onto the canvas, or insert an Image element and pick from the project's media.
  • Fonts — available in the font picker on any rich-text element.

Assets stay scoped to their project. To reuse an image across projects, upload it into each, or move templates that depend on it into the same project.

API Equivalents​

Portal actionAPI endpoint
List mediaGET /v1/file/projects/{projectId}/media
Show media (read links)POST /v1/file/projects/{projectId}/media/presigned-urls
List fontsGET /v1/file/projects/{projectId}/fonts
Load fonts (read links)POST /v1/file/projects/{projectId}/fonts/presigned-urls
Find media by tag or name, sortedGET /v1/file/projects/{projectId}/media with tag_ids, tag_match, untagged, search and sort
Tag mediaPOST /v1/file/projects/{projectId}/media/tags
List the project's tagsGET /v1/file/projects/{projectId}/tags
Move media to the trash, or restore itDELETE /v1/file/projects/{projectId}/media/{id} (?action=undelete restores)
Move a font to the trash, or restore itDELETE /v1/file/projects/{projectId}/fonts/{id} (?action=undelete restores)
Upload media or fontsPOST /v1/file/projects/{projectId}/uploads, PUT the file to the link it returns, then PATCH /v1/file/projects/{projectId}/uploads/{id} to finalize

See File Service for the full list.