Work with SVGs in Adobe Captivate

In the Visual Properties panel, the Content Width slider and Horizontal Padding are linked in the Alignment and Spacing section. Moving the slider from the left side changes the left padding value, and moving the slider from right changes the right padding value. The exact change is replicated in the Content Width slider when you change the left or right Horizontal padding values.

If you want to add padding at the top or bottom of the selected content block, enter the desired values for the Top and Bottom padding by changing the values in Vertical padding.

Select the Autofit height checkbox to adjust the height of the SVG content block to fit the slide. 

Move the Number of icons slider to increase or decrease the number of SVGs. You can add, at most, four SVGs.

Replace the SVG icons by clicking the folder icons. Click any folder and select an SVG from Assets or your computer.

Select a design option. The Design Options presents pre-configured layouts with cleaner design elements to apply to the SVG content block.

For more information, view Design options in Adobe Captivate.

In the Components section, you can change the following:

• Icon: This option remains disabled.

Move the Scale slider to resize the SVGs without distorting them. Scaling means that the SVGs fit the available width.

• Title: Add or remove the titles of the SVGs.
• Caption: Add or remove the captions of the SVGs.
  
• Body: Add or remove the body text of the SVGs.
  
• Card: Add or remove the card around the SVGs.

In the Background tab of the Appearance section, you can change the color settings at the content block level. Add the background color, border, and apply a shadow to shadow to the border. Select a solid color, linear or radial gradient, or add an image as a background.

If you've enabled Card, you can change the card's properties, such as padding, and add rounded corners by changing the radius values.

Also, add a background color, border, or shadow in the Card tab.

Select an SVG card in the content block.

In the Components section, you can change the following:

• Icon: Add or remove the SVG icon. Move the Scale slider to resize the SVG icon without distorting it. Scaling means that the SVG fits the available width.

• Title: Add or remove the SVG's title on the card.
• Caption: Add or remove the SVG's caption on the card.
  
• Body: Add or remove the SVG's body text on the card.
  
• Card: Add or remove the card around the SVG.

If you've enabled Card, you can change the card's properties, such as padding, and add rounded corners by changing the radius values.

Also, add a background color, border, or shadow in the Card tab.

Select an SVG card in the content block.

After replacing the default SVG icon, select the SVG icon. Then select Assets and then select an SVG from the Assets or your computer.

Click Replace icon.

Select the SVG.

In the States section, click Add to launch the States Flyout. Add the SVG's custom states.

For more information, view States in Adobe Captivate.

Select the folder icon in the Icon section to replace the SVG from Assets or on your computer.

Flip the SVG horizontally or vertically in the Flip icon section.

In the Appearance section, move the Opacity slider to increase or decrease the transparency of the SVG.

Select the SVG path and apply the fill color from the Solid color picker to change its color.

Select the checkbox Enable clicking in the bounding box to make the SVG and its whitespace within its bounding box clickable at runtime.