Caption

The Caption tool is a small modular element that allows us to create notations, citations, photo captions and more.

Examples

Caption is one of our more simple tools. Below we've included a couple of examples, but the real versatility for this tool comes with how you pair Caption with other tools, such as Images, Cards, and more.

BASICS. Your basic caption using Gray 700 color palette preset.

ALIGNMENT. Centered at Medium breakpoint and larger.

SELECT ALL. Clicking this caption will select all of its text. Useful for helping visitors copy and paste content.

57_air force Fighter 2

Every time we go up there, it’s like you’re flying with a ghost.

In previous versions of Foundry this tool was called Notes. We felt Caption better fit what this tool was most often used for. Additionally, with the Notes name freed up, we built a new tool for Edit Mode that helps you organize and document your content.

Settings

Edit Mode

Edit Mode Title

Allows you to add a custom label to the top title bar of the tool. This lets you quickly identify what purpose you're using that tool for in your layout. This title is also visible when you've collapsed or hidden the contents of the tool in Edit Mode.

General

Include Base Margin

When enabled a preset margin will be added to the base of the tool. Foundry allows you to configure the Base Margin preset to your liking within the Control Center. The Base Margin can be configured independently at each of the 6 responsive breakpoints.

Font

Font

Here we can define the font for this tool. You can choose to use one of the fonts defined in the Typeface stack or simply use the Base Font that is defined in the Foundry Control Center.

Font Weight

Allows you to adjust the font weight for your text. This setting goes from 100 to 900 in increments of 100. Standard Normal font weight is 400 and Bold font weight is generally 700.

Property

Handy settings for quickly applying an uppercase text transformation or forced italicization to your Caption.

Styling

Caption Style

Allows you to use one of Foundry's presets from the color palette or extended color palette, as well as the grey, white and dark preset values for styling the Caption text. You're also provided an option to choose a custom one-off color as well.

Alignment

Alignment (Uniform)

This setting allows you to align the tool to the left, center or right of its parent container. In Uniform mode this alignment will be set the same for all 6 breakpoints.

Alignment (Non-Uniform)

Clicking on the small plus icon will give you the ability to adjust the alignment of the button independently at each of the 6 responsive breakpoints giving you more granular control.

Extras

Select all text when clicked

When enabled the text contained in this tool will be completely selected when the visitor clicks on it. This helps to make content easy for your visitors to copy and paste.

HTML Comment

HTML Comment

Enabling this feature adds an HTML comment to the exported code to indicate the name of the tool being used here. This is helpful to both yourself and others when troubleshooting, or inspecting the code. This is enabled by default.

Custom

This field allows you to replace the default HTML Comment with your own text.

CSS

Classes

Allows you to specify an options class, or classes, that will be added to this tool's wrapper. You can use this to apply custom styling from the Blacksmith tool, or add a Bootstrap v5 preset class to your item. If you're applying more than one class be sure that you separate each class name with a space. Do not use special characters.