# ai-builder/2.1.0/assets/JSON-Blocks/images.js

AI Builder – Generate pages, blocks, images & translate with AI, version 2.1.0. 302 lines.

- Page: https://pluginprobe.com/plugins/ai-builder/2.1.0/code/assets/JSON-Blocks/images.js
- Raw: https://pluginprobe.com/plugins/ai-builder/2.1.0/raw/assets/JSON-Blocks/images.js
- Modified: 2025-08-23T08:19:58+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/ai-builder/2.1.0/code/assets/JSON-Blocks/images.js#L10-L20`.

```javascript
const images = [
  {
    id: "image-center-text-sides",
    jsonBlocks: {
      blockName: "core/group",
      attrs: {
        align: "full",
        className: "image-center-text-sides",
        layout: { type: "constrained" },
        style: {
          color: {
            background: "#f7fafc",
          },
          spacing: {
            padding: {
              top: "48px",
              right: "32px",
              bottom: "48px",
              left: "32px",
            },
          },
          border: {
            radius: "18px",
          },
        },
      },
      innerBlocks: [
        {
          blockName: "core/columns",
          attrs: {
            align: "full",
            className: "image-center-columns",
            verticalAlignment: "center",
            style: {
              spacing: {
                padding: {
                  left: "32px",
                  right: "32px",
                },
              },
            },
          },
          innerBlocks: [
            {
              blockName: "core/column",
              attrs: {
                className: "image-side-text",
                width: "33.33%",
                verticalAlignment: "center",
              },
              innerBlocks: [
                {
                  blockName: "core/paragraph",
                  attrs: {
                    className: "image-side-text-content ai-text-block",
                    content: "Share your vision. Inspire your audience.",
                    style: {
                      typography: {
                        fontSize: "20px",
                        fontWeight: "500",
                        lineHeight: "1.5",
                      },
                      color: {
                        text: "#2d3748",
                      },
                    },
                  },
                },
              ],
            },
            {
              blockName: "core/column",
              attrs: {
                className: "image-center-image",
                width: "33.33%",
                verticalAlignment: "center",
              },
              innerBlocks: [
                {
                  blockName: "core/image",
                  attrs: {
                    imageUrl: "",
                    className: "image-ui-rounded ai-image-block ai-image-block",
                  },
                },
              ],
            },
            {
              blockName: "core/column",
              attrs: {
                className: "image-side-text",
                width: "33.33%",
                verticalAlignment: "center",
              },
              innerBlocks: [
                {
                  blockName: "core/paragraph",
                  attrs: {
                    className: "image-side-text-content ai-text-block",
                    content: "Deliver your message. Make it memorable.",
                    style: {
                      typography: {
                        fontSize: "20px",
                        fontWeight: "500",
                        lineHeight: "1.5",
                      },
                      color: {
                        text: "#2d3748",
                      },
                    },
                  },
                },
              ],
            },
          ],
        },
      ],
    },
  },
  {
    id: "image-left-text-right",
    jsonBlocks: {
      blockName: "core/columns",
      attrs: {
        align: "full",
        className: "image-left-text-right",
        verticalAlignment: "center",
        style: {
          color: {
            background: "#f0f4f8",
          },
          spacing: {
            padding: {
              top: "40px",
              right: "32px",
              bottom: "40px",
              left: "32px",
            },
          },
          border: {
            radius: "16px",
          },
        },
      },
      innerBlocks: [
        {
          blockName: "core/column",
          attrs: { className: "image-left-image", width: "50%" },
          innerBlocks: [
            {
              blockName: "core/image",
              attrs: {
                imageUrl: "",
                className: "image-ui-rounded ai-image-block ai-image-block",
              },
            },
          ],
        },
        {
          blockName: "core/column",
          attrs: { className: "image-left-text", width: "50%" },
          innerBlocks: [
            {
              blockName: "core/paragraph",
              attrs: {
                className: "image-left-text-content ai-text-block",
                content: "Engaging content, right where you need it.",
                style: {
                  typography: {
                    fontSize: "22px",
                    fontWeight: "600",
                  },
                  color: {
                    text: "#1a202c",
                  },
                },
              },
            },
          ],
        },
      ],
    },
  },
  {
    id: "image-right-text-left",
    jsonBlocks: {
      blockName: "core/columns",
      attrs: {
        align: "full",
        className: "image-right-text-left",
        verticalAlignment: "center",
        style: {
          color: {
            background: "#f0f4f8",
          },
          spacing: {
            padding: {
              top: "40px",
              right: "32px",
              bottom: "40px",
              left: "32px",
            },
          },
          border: {
            radius: "16px",
          },
        },
      },
      innerBlocks: [
        {
          blockName: "core/column",
          attrs: { className: "image-right-text", width: "50%" },
          innerBlocks: [
            {
              blockName: "core/paragraph",
              attrs: {
                className: "image-right-text-content ai-text-block",
                content: "Highlight your ideas with clarity and style.",
                style: {
                  typography: {
                    fontSize: "22px",
                    fontWeight: "600",
                  },
                  color: {
                    text: "#1a202c",
                  },
                },
              },
            },
          ],
        },
        {
          blockName: "core/column",
          attrs: { className: "image-right-image", width: "50%" },
          innerBlocks: [
            {
              blockName: "core/image",
              attrs: {
                imageUrl: "",
                className: "image-ui-rounded ai-image-block ai-image-block",
              },
            },
          ],
        },
      ],
    },
  },
  {
    id: "image-top-text-bottom",
    jsonBlocks: {
      blockName: "core/group",
      attrs: {
        className: "image-top-text-bottom",
        layout: { type: "constrained" },
        style: {
          color: {
            background: "#f7fafc",
          },
          spacing: {
            padding: {
              top: "36px",
              right: "32px",
              bottom: "36px",
              left: "32px",
            },
          },
          border: {
            radius: "14px",
          },
        },
      },
      innerBlocks: [
        {
          blockName: "core/image",
          attrs: {
            imageUrl: "",
            className: "image-ui-rounded ai-image-block ai-image-block",
          },
        },
        {
          blockName: "core/paragraph",
          attrs: {
            className: "image-bottom-text-content ai-text-block",
            content: "A clear message, right below your image.",
            style: {
              typography: {
                fontSize: "20px",
                fontWeight: "500",
              },
              color: {
                text: "#2d3748",
              },
            },
          },
        },
      ],
    },
  },
];

export default images;

```