Image

IntroductionLinked dataHuman and agentComponents

Layout and media / Image

Show a figure, photo, or generated visual beside the analysis.

Live exampleHow it worksSkill

When to use it

Show a figure, photo, or generated visual beside the analysis.

What the agent supplies

A raster or vector image by URL, sized to a preset variant.

The agent chooses the content and binds it to the component. CLIO then renders the view and its available controls.

What the agent receives

The exact output of load_skill, including resolved local definitions.

load_skill("a2ui-catalog-basic", file="catalog.json#/components/Image")

{
  "type": "object",
  "allOf": [
    {
      "$ref": "https://a2ui.org/specification/v0_9/common_types.json#/$defs/ComponentCommon"
    },
    {
      "type": "object",
      "properties": {
        "weight": {
          "type": "number",
          "description": "The relative weight of this component within a Row or Column. This is similar to the CSS 'flex-grow' property. Note: this may ONLY be set when the component is a direct descendant of a Row or Column."
        }
      }
    },
    {
      "type": "object",
      "properties": {
        "component": {
          "const": "Image"
        },
        "url": {
          "$ref": "https://a2ui.org/specification/v0_9/common_types.json#/$defs/DynamicString",
          "description": "The URL of the image to display."
        },
        "description": {
          "$ref": "https://a2ui.org/specification/v0_9/common_types.json#/$defs/DynamicString",
          "description": "Accessibility text for the image."
        },
        "fit": {
          "type": "string",
          "description": "Specifies how the image should be resized to fit its container. This corresponds to the CSS 'object-fit' property.",
          "enum": [
            "contain",
            "cover",
            "fill",
            "none",
            "scaleDown"
          ],
          "default": "fill"
        },
        "variant": {
          "type": "string",
          "description": "A hint for the image size and style.",
          "enum": [
            "icon",
            "avatar",
            "smallFeature",
            "mediumFeature",
            "largeFeature",
            "header"
          ],
          "default": "mediumFeature"
        }
      },
      "required": [
        "component",
        "url"
      ]
    }
  ],
  "unevaluatedProperties": false
}

Standard refs (not loadable here): https://a2ui.org/specification/v0_9/common_types.json#/$defs/ComponentCommon, https://a2ui.org/specification/v0_9/common_types.json#/$defs/DynamicString