Working with Images as the GM

Fantasy Grounds VTT Images

Note: Fantasy Grounds VTT is still in active development and new features are being added and improved all the time. Some screenshots below may not yet be updated to match the current tool sets available, but the functionality should be the same or similar.
We are working to update this and our entire wiki to match current features and visuals.

Importing Images into Fantasy Grounds

Fantasy Grounds VTT supports any JPG and PNG images, as well as Google’s next-generation media-rich WEBP and WEBM formats, and Universal VTT file formats – DD2VTT, DF2VTT and UVTT used by such applications as Dungeondraft, Dungeon Fog, Dungeon Alchemist, Hero Forge, and others.

These will appear in the Assets window under Images when you add them to your campaign. From there, you can copy them into your campaign, set a grid, define line of sight and use them in your campaign.

image-20240904-211216.png

Follow either of these two methods to include new images in your campaign from outside of Fantasy Grounds. If the image is online, you should first save it to your local disk.

Method 1 - Import File (Recommended)

The example is using the 5E ruleset and the built-in Leather theme. Your screen may look slightly different depending on the ruleset you chose.

  1. Open the Images window using the sidebar button for the ruleset you are using.

  2. (Optional) Click on the Group dropdown and choose which group to place the image or create a new group and choose that.

  3. Click the Import button (the blue and white “up arrow” button next to the All button).

    image-20240904-212016.png

     

  4. Browse for the file. You can filter file types by selecting any of the individual file types from the dropdown, or leave the default “All Files” to see all files eligible for import.

Method 2- Import Assets (Bulk Import)

If you have a large number of files you want to import into your campaign all at once, you can use this method to do it in fewer steps.

  1. Open your Assets window

  2. Click on the Folder button to open your Data folder

  3. Navigate to your campaign’s image folder.
    Default paths to campaigns:
    Windows: C:\Users\[YourUsername]\AppData\Roaming\SmiteWorks\Fantasy Grounds\campaigns\[YourCampaign]\images
    macOS: /Users/[YourUsername]/SmiteWorks/Fantasy Grounds/campaigns/[YourCampaign]/images
    Linux: /home/[username]/.smiteworks/campaigns/[YourCampaign]/images
    Note: the .smiteworks folder may be hidden by default. Enable "Show Hidden Files” in the file manager settings.

  4. Place any images you want to use there. This will add a folder called Campaign to your Assets window under Images.

  5. Open the Images screen from the Sidebar buttons

  6. (Optional) Click on the Group Dropdown and choose which group to place the image or create a new group and choose that.

  7. Click on the Create From Campaign Assets button at the top and answer Yes at the Prompt.

Method 3 - Manual Import from Assets

See for more information.

For images created outside of Fantasy Grounds, follow these steps to add it to your Assets and then to your campaign.

  1. Open your Assets window

  2. Click on the Folder button to open your Data folder

  3. Navigate to your campaign’s image folder

  4. Place any images you want to use there.

  5. Return to the Assets window and change to the Images Mode

  6. Locate and open the Campaign folder

  7. Drag the images from there to your Images window

Image Windows and Icons

Once an image is opened and ready for use, there are several options available before you even get into altering the image, adding PCs/NPCs, etc. Here is what each section of the Image Window means:

  1. Record Link - You can drag and drop a direct link to the open image almost anywhere; on the Hot Bar at the bottom for quick reopening, onto the chat window for all to see and use, into other open documents or notes, etc.

  2. Image Name icon - Denotes the Image Name field.

  3. Module Name icon - Shows what module the image was loaded from.

  4. Revert Changes To Module Record - Allows you to easily revert the image to the one contained in the module.

  5. Image Name field - Where the name of the image is. This can be the name of the corresponding file, or can be edited to be whatever you like.

  6. Unidentified Name icon - Denotes the Unidentified Name field

  7. Unidentified Name field - You can edit this field to name the image what you would like your players to see if the image is unidentified.

  8. Identified / Unidentified toggle icon:
    Highlighted with Checkmark - Identified
    Unhighlighted with X - Unidentified

  9. Locked / Unlocked toggle icon:
    When unlocked, you can fully edit or alter the image with the complete Image Controls explained below. When locked, editing is no longer possible.
    Highlighted with Lock Closed - Locked
    Unhighlighted with Lock Open - Unlocked

  10. Public / Not Shared toggle icon:
    Public - Can be shared with players and reopened by them if shared.
    Not Shared - Has not been shared and cannot be opened by Players if previously shared.

  11. Open Help icon - Will take you to the corresponding area of the wiki for this particular window. In this case, the page you are reading right now.

  12. Minimize Window - Will reduce the window to a single round icon on the FGVTT desktop that you can move around and click to reopen.

  13. Increase Size - Will increase the size of the window to fill the desktop between the chat box on the left and the Sidebar on the right. If clicked again after the size is increased, the image will fill the desktop, going behind the chat box and filling all other available space, but will not cover the Sidebar. If clicked a third time, the window will increase to fill all available space including covering the chat box and Sidebar.

  1. Close icon - This will close the window completely and without warning.

  2. Toggle Toolbar icon - This will open a bar directly above the Image Controls below. These icons and how they can change depending on what a window is used are explained in the Toggleable Toolbar section below.

Toggleable Toolbar

The Toggleable Toolbar will show or hide different icons depending on the use case of the image.

For example, if an image is open, but the image isn’t being used as an active map with PCs and NPCs added from the Combat Tracker, the toolbar will look like this:

If an image is being used as a map with players and NPCs on the map, additional icons will be available:

To illustrate each icon’s function in a visual manner without overloading this page, please click over to the Toggleable Toolbar Functions page.

Link:https://fantasygroundsunity.atlassian.net/wiki/spaces/FGCP/pages/2415460356

Using the Image Control

You can unlock the image to access the Image Control. Within the Image control, you have a main mode, sub-mode and then additional controls dependent upon the submode.

Modes

Icon

Description

Icon

Description

Play Mode

 

Play Submode

This is the default mode that allows the mouse to pan the window.

 

Token Selection

Single click to choose a token or draw a rectangle around a group of tokens that you want to select for movement.

 

Token Targeting

Use this mode to select targets for an action.

In most rulesets you can simply CTRL+Click on a target

 

Drawing Mode

This mode allows simple drawing in your chosen dice color. For more advanced drawing, refer to the Paint mode.

 

Erase Drawing

This mode changes the cursor to an eraser. The eraser removes parts of a drawing you have made.

 

Ping Mode

This mode allows GMs and players to display radial pings on the map.

 

 

 

 

Additional Play Controls

View Type - Changes between 2D (Top Down) mode, Free Camera 3D mode and Token View 3D mode

Zoom Extents - resizes the image to fit inside the Image window

Show/Hide Shortcuts - toggle pin visibility for the GM

Enable/Disable Player Vision Preview - toggles GM and Player view of the map

Enable/Disable Line-of-Sight - turns on or off Dynamic Line of Sight.

Toggle Token Lock - turns on or off token locking for movement planning and approval.

Toggle Grid Snap - turns on or off snapping to grid centers, corners and edges of grids.

Layers Mode

 

 

 

Layers-Transform Submode

Here you can manipulate a layer (see Layers below) to rotate it, scale it, flip it, or change the color.

 

 

 

Layers-Tile Submode

Used to add tile images onto the map. You can rotate, scale, flip or color the tile before it is placed. Each time you click on the map, a new tile layer will be added to the Layers section.

To place a tile:

  1. Drag a tile image from the Assets - Images window to the Graphic Asset area.

  2. Set a default settings for this and all future tiles

    1. Default size in grid coordinates

    2. Default rotation

    3. Color Tint

  3. Click on the map to place the tile.

  4. Continue clicking to add more of the same tile

  5. You can now drag new tiles directly from the Assets window to the map and they will inherit all the Tile settings from Step 2.

 

Paint Mode

 

 

Duplicate Selection As Walls - copy and paste selection as a wall piece.

Duplicate Paint Layer As Walls - copy and paste paint layer as a wall piece.

Remove Selected Points - Select multiple points to delete from the line.

Simplify Selected Strokes - Reworks selection to be less complicated

Reverse Selected Strokes - Inverts the stroke selection direction.

 

 

 

Drawing Lines

You can adjust the default brush size, color tint, size, angle, shadow and fade strength, how it overlaps other parts, end cap type and corner type of your line. Rotating, flipping, snapping to grid and magnetic snapping are also available options.

Any drawing will add a new Paint layer if you don’t already have one selected.

Free-form Drawing: left-click and hold to draw a line using the mouse.

Straight-lines: single click on each point where you want it to draw a straight line. Double-click or press Enter to end the line.

Draw with Image

Switch from Brush Mode (default) to Image Mode in the Image Control. Drag an image from the Assets window to the Graphic Asset area. Adjust the size, color and rotation and then draw free-form or straight lines.

 

 

 

Draw Rectangle

Click and drag from the starting corner of your rectangle to the opposite corner of your rectangle.

 

 

 

Draw Circle or Ellipse

Click and drag from the starting boundary of the ellipse to the ending boundary of the ellipse.

 

 

 

Adding Image Stamps

Image Stamps switch from Brush Mode to Image Mode automatically.

To place a stamp:

  1. Drag an image from the Assets window to your Graphic Asset area.

  2. Set the default color, size, rotation and orientation.

  3. click on the map to stamp the image.

  4. All stamps are added to the current Paint layer. If there is no paint layer, one will be created for you.

 

 

 

 

 

Erasing Drawings

  1. Set the size of your eraser

  2. Choose the paint layer you want to erase (if you have multiples)

  3. Hold down the left mouse button with your erase cursor over the section you want to erase.

 

Edit Filled Strokes - Provides several keyboard and mouse combinations to achieve different fill effects.

FX Mode

 

 

Layers list

 

FX Type

 

 

The FX Type dropdown will be blank by default. You must first add a new FX layer by using the layer controls at the bottom of the image control.

To add a new Fx layer:

  1. Click the Add FX Layer button to add a new FX layer

  2. Select the newly added layer

  3. Select the FX you want from the FX Type dropdown menu

Each FX Type will have it’s own specific adjustment. For example:

 

Layer Line of Sight (LOS)

 

 

 

 

 

LOS Drawing Mode

The 2nd toolbar allow Selection, Draw Line, Draw Rectangle and Draw Ellipse. They function just like drawing in Paint Mode.

 

 

 

LOS - Wall Mode

Walls block line of sight and movement for players.

Walls are shown in Red.

 

 

 

LOS - Terrain Mode

Players can see into the first terrain in their vision. The back edge of the terrain blocks line of sight much like a wall.

Players inside of terrain can see out of it in all directions.

Terrain is shown in Green.

 

 

 

LOS - Door Mode

Players can see the contents of a door, but not beyond it. Hovering over a door will allow the option to Open or Close the door.

* The GM can shift+click on the door to lock or unlock it.

Doors are shown in Blue.

 

 

 

LOS - Secret Mode

Secret areas will act just like a wall to players. The GM, however, will have the option to open the secret door. This will allow players to see through the area and move through it.

* The GM can shift+click on the door to lock or unlock it

Secret doors are shown in Blue with a dashed line.

 

 

LOS - Window Mode

Windows allow players to see through the window but not move through it unless it is opened first. Windows can be locked

* The GM can shift+click on the door to lock or unlock it

Windows are shown in Yellow.

 

 

 

LOS - Illusionary Wall

Illusionary Walls are lines that block line of sight just like a wall, but which do not restrict player movement. Players can move straight through the wall without GM intervention.

Illusionary Walls are shown in yellow dashed lines.

 

 

 

LOS - Pits (Experimental)

Open pits block movement and vision out of the pit when the token is inside the pit. Closed pits have no effect on movement or vision.

* The GM can open or close the pit

 

 

LOS - Shadow Caster (Experimental)

Add shadowed sections to a map regardless of terrain or occlusions.

Shadows are shown in a light green dashed line.

 

Grid Snap toggle - Turns snapping to the predefined grid on or off.

Point Snap toggle - Turns snapping to points in occluder splines on and off.

Peek: This is the amount users can see past where the occluder is drawn. The amount of peek-thru is relative to the grid size. For example, 0.1 is 10% of a grid square while 1.0 is a full grid square.

This can be useful to show that the occluder is drawn on a wall, for example, by letting the players see that there is a wall being hidden by the occluder, but not see completely into the room on the other side.

Lighting

 

Select Light

Select Light - allows you to select lights already added to a map.

Light Range and Color can be adjusted here as well as turning individual lights on and off. You can also change them into “darkness” instead of the default “light”.

Several preset behaviors, speeds and presets are available in the dropdown menus.

 

Add Light

Has the same capabilities as Select Light above.

 

Token Light

Player tokens and NPC tokens can carry around their own light sources. This is where you can create and configure those lights.

As the token moves, so will the light. Tokens can have multiple light sources attached, although remember that light sources are additive.
See:

 

Token Vision

Similar to Token Light, you can configure and assign a token’s vision from this menu.
See:

 

Ambient Light

This menu allows you to configure the ambient lighting that is drawn over the entire map.

See:

Global LOS

 

 

 

Enable or Disable Global LOS Mask

Click the + icon to turn on Global Mask. It will add a dark gray layer over the map.

Click the - icon to disable the Global LOS Mask.

 

Reveal Area

Remove Rectangle from Global LOS Mask

Click and drag from one corner of a rectangle to the opposite corner.

 

 

 

Hide Area

Fill Rectangle on Global LOS Mask

Click and drag from one corner of a rectangle to the opposite corner.

Grid Mode

 

 

 

Grid

This is the edit mode for the grid that overlays a map. Settings can be changed here or in the Set Grid With Mouse mode seen below.

 

 

Set Grid With Mouse

Switch from Edit Mode to Mouse Assignment and then drag from the upper left corner of a map square to the bottom right to set the grid size and location.

Edit it further using the edit controls.

 

 

 

Set the Grid Type

You can choose

  • a square (rectangular) grid

  • isometric grid (diamond)

  • Flat top hex

  • Point top hex

 

 

 

 

Adjust Grid

You can adjust the width and height of the grid in pixels. You can use decimal points.

Unlink width and height if they are not the same using the link button in between width and height.

Use the arrow keys to nudge the grid placement.

 

Keyboard Shortcuts

Keyboard shortcuts change depending on which mode is selected.

Mode

Keyboard

Action

Mode

Keyboard

Action

Play Mode w/ Token Selected

Arrow Keys, Num Pad or ASDW navigation

Arrow Keys and Num Pad:
Move up, down, left or right by 1 grid square.
Use the Number Pad to move diagonal as well (1,3,7,and 9).

ASDW:
A - Left / S - Up / D - Right / W - Down
X - Zoom Out / C - Zoom In

Drawing Mode or Line of Sight Mode

(no points selected)

Arrow Keys

Pan the map by 1 grid square in the direction of the arrows

Spacebar

Add a new point at the current cursor position and continue editing this drawing.

Enter

Add a new point at the current position and complete the current drawing.

Esc

Cancel the current drawing and complete it at the previous point

Ctrl+Z

Undo last action

Ctrl+Y

Redo last action from Undo

CTRL

Temporarily toggle grid snapping mode for next point (while held)

Layers Transform w/ Tile Selected

Arrow keys

Move currently selected tile by 1 grid square in the direction of the arrow.

Layers Transform w/ Tile Selected

 

Shift+Left Arrow
Shift + Right Arrow

Spin current tile clockwise or counter-clockwise by 45 degrees.

Shift + Up Arrow

Shift + Down Arrow

Increase or decrease scale of current tile by 1 grid square

Right-Click Menus

Menu

Description

Menu

Description

 

 

Main Menu

Clockwork order from the top.

Close Window - Closes the current window

Minimize - Minimizes the window to a button

View - Shows different view modes

Layers - Grid, Pins, Mask visibility

Drawing - freehand drawing on the map

Lock/Unlock Tokens - Allows tokens to move freely without GM approval

Sharing - shows the image on the players' screens

Pointers - Draw cones, squares, circles and arrows using the grid coordinates.

 

Pointers Menu

Arrow - useful for pointing out features

Square - useful for defining areas

Circle - useful for defining areas

Cone - useful for spell area of effects

 

Drawing Menu

Unlock Drawing Mode - toggle locked and unlocked state

Enter Drawing Mode - this does not have the same level of features as the Image Control options explained earlier, but it allows for simple drawings with the default drawing brush.

Layers Menu

Toggle Shortcuts - this changes visibility for shortcuts (GM Only)

Toggle Grid - hides or shows the grid

Snap to Grid - on or off (hold CTRL to override)

Grid Type - select Hex Row, Hex Column, Square or Isometric

Enable Mask - this turns on or off the Global mask

 

Grid Type

Hex Row Grid - creates a hex grid in rows

Hex Column Grid - creates a hex grid in columns

Square Grid - created a square grid

Isometric Grid - creates an isometric grid

 

View Menu

Reset Zoom - sets image back to default zoom level

Zoom To Fit - Zooms to fit within maximum window size

Zoom To Fill - Zooms to fill the space it occupies

Sync Client View - Sets the zoom level on all players' desktops to the same level

 

Sharing Menu

Share Record - Shared the current item with all players

Stop Sharing Record - Stops sharing the item with players

Using Dynamic Line of Sight for Maps

Some maps may be preloaded with line of sight (LOS) data. For other maps, you can create your own LOS data. Refer to the Map Line of Sight Style Guide for more info on creating your own LOS data.

  1. Open your Map and unlock it to reveal the Image Control

  2. Verify that the layer with the map has an indicator showing that LOS has been defined (see image)

  3. Turn on Enable LOS. It is off by default

  4. Drag a player token onto the map from the Combat Tracker (or add an NPC from an encounter or Combat Tracker)

Videos

https://www.youtube.com/watch?v=-Ke5b6TW7T8