Google Fonts使用教程日文信息图

{
  "type": "日式信息图",
  "topic": "[Google Fonts的使用方法]",
  "style": "利落现代扁平化设计，纯白背景，柔和粉蓝与薄荷色角落渐变色块，带微阴影的圆角卡片，科技教程视觉风格，清晰矢量排版与UI插图",
  "canvas": {
    "aspect_ratio": "16:9"
  },
  "headline": {
    "main": "[Google Fontsの使い方]",
    "sub": "[基本の3ステップ]"
  },
  "layout": {
    "sections": [
      {
        "title": "[1. フォントを選ぶ]",
        "position": "left",
        "count": 1,
        "labels": [
          "[1. フォントを選ぶ]"
        ],
        "card_style": "带浅蓝边框与柔和阴影的圆角白色面板",
        "icon": "带数字1的蓝色圆形图标",
        "illustration": "显示字体搜索UI的浏览器窗口，包含3行大型‘Aa あ’字体预览、顶部搜索栏与简洁界面线条",
        "body_text": "[Google Fontsのサイトで、好きな書体を探します。]"
      },
      {
        "title": "[2. 埋め込みコードを取得]",
        "position": "center",
        "count": 1,
        "labels": [
          "[2. 埋め込みコードを取得]"
        ],
        "card_style": "带浅蓝边框与柔和阴影的圆角白色面板",
        "icon": "带数字2的蓝色圆形图标",
        "illustration": "带有两条代码片段并由细线分隔的深色代码编辑面板",
        "code_blocks": {
          "count": 2,
          "labels": [
            "<link> (HTML)",
            "@import (CSS)"
          ],
          "content": [
            "<link href=\"https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap\" rel=\"stylesheet\">",
            "@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');"
          ]
        },
        "body_text": "[表示された<link>やCSSをコピーします。]"
      },
      {
        "title": "[3. CSSで適用]",
        "position": "right",
        "count": 1,
        "labels": [
          "[3. CSSで適用]"
        ],
        "card_style": "带浅蓝边框与柔和阴影的圆角白色面板",
        "icon": "带数字3的蓝色圆形图标",
        "illustration": "展示带有两个选择器及font-family样式的白色代码卡片",
        "code_blocks": {
          "count": 2,
          "labels": [
            ".title",
            "body"
          ],
          "content": [
            ".title { font-family: 'Poppins', sans-serif; }",
            "body { font-family: 'Noto Sans JP', sans-serif; }"
          ]
        },
        "body_text": "[font-familyを指定して、デザインに反映します。]"
      },
      {
        "title": "[ポイント]",
        "position": "bottom-left",
        "count": 3,
        "labels": [
          "[読みやすさで選ぶ]",
          "[日本語対応を確認する]",
          "[使いすぎず、2〜3種類に絞る]"
        ],
        "card_style": "淡蓝色调圆角白色卡片",
        "icon": "圆形内的蓝星图标",
        "body_format": "项目符号列表"
      },
      {
        "title": "[よく使う組み合わせ]",
        "position": "bottom-center-right",
        "count": 2,
        "labels": [
          "[見出し: Poppins]",
          "[本文: Noto Sans JP]"
        ],
        "card_style": "淡薰衣草紫圆角白色卡片",
        "icon": "紫色双环相扣图标",
        "body_format": "两个胶囊型示例框"
      }
    ],
    "connectors": {
      "count": 2,
      "style": "连接顶部3个卡片的大号蓝色向右箭头"
    },
    "pagination": {
      "text": "[2 / 2]",
      "position": "bottom-right",
      "style": "蓝色圆角标签"
    }
  },
  "text_language": "Japanese",
  "color_palette": {
    "primary_blue": "#2f80ff",
    "navy": "#0f2b5b",
    "google_colors": [
      "#4285F4",
      "#DB4437",
      "#F4B400",
      "#0F9D58"
    ],
    "lavender": "#8b6cff",
    "background": "#ffffff"
  }
}