{
  "title": "CSS flexbox",
  "human_url": "https://happytails.ai/en/api/tools/css-flexbox/",
  "agent_url": "https://happytails.ai/agents/en/api/tools/css-flexbox/",
  "language": "en",
  "markdown_url": "https://happytails.ai/en/api/tools/css-flexbox.md",
  "content": "API reference\nCSS flexbox\nResponsive interactive preview with generated CSS and minimal HTML.\nPOST\n/api/v1/tools/css-flexbox/run\nBase URL: https://happytails.ai\n· public API not connected\nOverview\nResponsive interactive preview with generated CSS and minimal HTML.\nAll API requests process supplied data on the server.\nRequest parameters\nSend a JSON object. Unknown properties are rejected. Omitted options use the defaults below; enter numbers and booleans as JSON values, not quoted text.\nNo text input is needed. Use the settings below.\nThis endpoint does not accept a\nfiles\narray.\nOptions\noptions.direction\nstring\nDirection\nDefault:\n\"row\"\n· Allowed:\nrow\n,\ncolumn\n,\nrow-reverse\n,\ncolumn-reverse\noptions.justify\nstring\nJustify\nDefault:\n\"flex-start\"\n· Allowed:\nflex-start\n,\ncenter\n,\nspace-between\n,\nspace-around\n,\nflex-end\noptions.align\nstring\nAlign\nDefault:\n\"stretch\"\n· Allowed:\nstretch\n,\ncenter\n,\nflex-start\n,\nflex-end\noptions.wrap\nstring\nWrap\nDefault:\n\"wrap\"\n· Allowed:\nwrap\n,\nnowrap\noptions.gap\nnumber\nGap (px)\nDefault:\n16.0\nSuccess response\nHTTP 200 returns\ntool\nand\nresult\n. Text is in\nresult.text\n; parsed JSON may also appear in\nresult.data\n. Generated files are in\nresult.files\nwith\nname\n,\nmime\n,\nbytes\nand\nbase64\n. Decode the bytes before saving. Empty file arrays and null text are valid for operations returning another result type.\nComplete output schema\n{\n\"type\": \"object\",\n\"required\": [\n\"tool\",\n\"result\"\n],\n\"properties\": {\n\"tool\": {\n\"type\": \"string\"\n},\n\"result\": {\n\"type\": \"object\",\n\"required\": [\n\"text\",\n\"files\"\n],\n\"properties\": {\n\"text\": {\n\"type\": [\n\"string\",\n\"null\"\n]\n},\n\"data\": {\n\"description\": \"Parsed JSON when the textual result is JSON.\"\n},\n\"name\": {\n\"type\": \"string\"\n},\n\"mime\": {\n\"type\": \"string\"\n},\n\"files\": {\n\"type\": \"array\",\n\"items\": {\n\"type\": \"object\",\n\"required\": [\n\"name\",\n\"mime\",\n\"bytes\",\n\"base64\"\n],\n\"properties\": {\n\"name\": {\n\"type\": \"string\"\n},\n\"mime\": {\n\"type\": \"string\"\n},\n\"bytes\": {\n\"type\": \"integer\"\n},\n\"base64\": {\n\"type\": \"string\",\n\"contentEncoding\": \"base64\"\n}\n}\n}\n}\n}\n}\n}\n}\nLimits and failures\nLimits below are enforced by this endpoint. Additional format, page, duration and model limits in the behavior notes also apply. Browser UI limits can differ from API limits.\nrequest_bytes\n8388608\ninput_characters\n1000000\nfiles_bytes\n5242880\nmax_files\n0\ntimeout_seconds\n12\nInvalid requests return an\nerror\nobject with\ncode\nand\nmessage\n. Read\nHTTP statuses, retries, timeouts and concurrency\n. Execution is synchronous and results are returned in the response.\nComplete request schema\nExpand the JSON schema\n{\n\"type\": \"object\",\n\"additionalProperties\": false,\n\"properties\": {\n\"input\": {\n\"type\": \"string\",\n\"maxLength\": 1000000,\n\"default\": \"\",\n\"description\": \"Plain text input. File tools use files instead unless otherwise documented.\"\n},\n\"options\": {\n\"type\": \"object\",\n\"additionalProperties\": false,\n\"properties\": {\n\"direction\": {\n\"type\": \"string\",\n\"description\": \"Direction\",\n\"default\": \"row\",\n\"enum\": [\n\"row\",\n\"column\",\n\"row-reverse\",\n\"column-reverse\"\n]\n},\n\"justify\": {\n\"type\": \"string\",\n\"description\": \"Justify\",\n\"default\": \"flex-start\",\n\"enum\": [\n\"flex-start\",\n\"center\",\n\"space-between\",\n\"space-around\",\n\"flex-end\"\n]\n},\n\"align\": {\n\"type\": \"string\",\n\"description\": \"Align\",\n\"default\": \"stretch\",\n\"enum\": [\n\"stretch\",\n\"center\",\n\"flex-start\",\n\"flex-end\"\n]\n},\n\"wrap\": {\n\"type\": \"string\",\n\"description\": \"Wrap\",\n\"default\": \"wrap\",\n\"enum\": [\n\"wrap\",\n\"nowrap\"\n]\n},\n\"gap\": {\n\"type\": \"number\",\n\"description\": \"Gap (px)\",\n\"default\": 16.0\n}\n}\n}\n}\n}\nFor browser automation, use the central\nWebMCP guidance\nand discover the tools actually exposed by the browser.\nRequest example\ncURL\ncurl https://happytails.ai/api/v1/tools/css-flexbox/run \\\n-H \"Content-Type: application/json\" \\\n--data '{\"options\": {\"direction\": \"row\", \"justify\": \"flex-start\", \"align\": \"stretch\", \"wrap\": \"wrap\", \"gap\": 16.0}}'\nJavaScript\nconst payload = {\n\"options\": {\n\"direction\": \"row\",\n\"justify\": \"flex-start\",\n\"align\": \"stretch\",\n\"wrap\": \"wrap\",\n\"gap\": 16.0\n}\n};\nconst response = await fetch(\n\"https://happytails.ai/api/v1/tools/css-flexbox/run\",\n{\nmethod: \"POST\",\nheaders: { \"Content-Type\": \"application/json\" },\nbody: JSON.stringify(payload)\n}\n);\nconst data = await response.json();\nif (!response.ok) throw new Error(data.error.message);\nconsole.log(data.result);\nPython\nimport json\nfrom urllib.request import Request, urlopen\npayload = json.loads('{\"options\": {\"direction\": \"row\", \"justify\": \"flex-start\", \"align\": \"stretch\", \"wrap\": \"wrap\", \"gap\": 16.0}}')\nrequest = Request(\n\"https://happytails.ai/api/v1/tools/css-flexbox/run\",\ndata=json.dumps(payload).encode(),\nheaders={\"Content-Type\": \"application/json\"},\n)\nwith urlopen(request, timeout=200) as response:\nresult = json.load(response)\nprint(result)\nJSON\n{\n\"options\": {\n\"direction\": \"row\",\n\"justify\": \"flex-start\",\n\"align\": \"stretch\",\n\"wrap\": \"wrap\",\n\"gap\": 16.0\n}\n}\nReplace the API origin and input values for your application.\n200 OK · response structure\nJSON\n{\n\"tool\": \"css-flexbox\",\n\"result\": {\n\"text\": null,\n\"files\": []\n}\n}\nIllustrative envelope. Actual text, filename, MIME type and bytes depend on the result. See the complete output schema.\n400 Bad Request\nJSON\n{\n\"error\": {\n\"code\": \"INVALID_INPUT\",\n\"message\": \"Unknown request property. See the tool input schema.\"\n}\n}",
  "content_format": "text/plain",
  "visibility": "public",
  "links": [
    {
      "name": "HTTP statuses, retries, timeouts and concurrency",
      "url": "https://happytails.ai/en/api/#limits"
    },
    {
      "name": "WebMCP guidance",
      "url": "https://happytails.ai/en/api/#browser-agents"
    }
  ],
  "markdown": "# CSS flexbox\n\n- Human page: https://happytails.ai/en/api/tools/css-flexbox/\n- Markdown: https://happytails.ai/en/api/tools/css-flexbox.md\n- Structured JSON: https://happytails.ai/agents/en/api/tools/css-flexbox/index.json\n- Visibility: public\n\n## Page guide\n\nAPI reference\n\nResponsive interactive preview with generated CSS and minimal HTML.\n\nPOST\n\n/api/v1/tools/css-flexbox/run\n\nBase URL: https://happytails.ai · public API not connected\n\n## Overview\n\nResponsive interactive preview with generated CSS and minimal HTML.\n\nAll API requests process supplied data on the server.\n\n## Request parameters\n\nSend a JSON object. Unknown properties are rejected. Omitted options use the defaults below; enter numbers and booleans as JSON values, not quoted text.\n\nNo text input is needed. Use the settings below.\n\nThis endpoint does not accept a `files` array.\n\n### Options\n\n#### `options.direction`\n\nType: string\n\nDirection\n\nDefault: `\"row\"` · Allowed: `row`, `column`, `row-reverse`, `column-reverse`\n\n#### `options.justify`\n\nType: string\n\nJustify\n\nDefault: `\"flex-start\"` · Allowed: `flex-start`, `center`, `space-between`, `space-around`, `flex-end`\n\n#### `options.align`\n\nType: string\n\nAlign\n\nDefault: `\"stretch\"` · Allowed: `stretch`, `center`, `flex-start`, `flex-end`\n\n#### `options.wrap`\n\nType: string\n\nWrap\n\nDefault: `\"wrap\"` · Allowed: `wrap`, `nowrap`\n\n#### `options.gap`\n\nType: number\n\nGap (px)\n\nDefault: `16.0`\n\n## Success response\n\nHTTP 200 returns `tool` and `result`. Text is in `result.text`; parsed JSON may also appear in `result.data`. Generated files are in `result.files` with `name`, `mime`, `bytes` and `base64`. Decode the bytes before saving. Empty file arrays and null text are valid for operations returning another result type.\n\n### Complete output schema\n\n```json\n{\n  \"type\": \"object\",\n  \"required\": [\n    \"tool\",\n    \"result\"\n  ],\n  \"properties\": {\n    \"tool\": {\n      \"type\": \"string\"\n    },\n    \"result\": {\n      \"type\": \"object\",\n      \"required\": [\n        \"text\",\n        \"files\"\n      ],\n      \"properties\": {\n        \"text\": {\n          \"type\": [\n            \"string\",\n            \"null\"\n          ]\n        },\n        \"data\": {\n          \"description\": \"Parsed JSON when the textual result is JSON.\"\n        },\n        \"name\": {\n          \"type\": \"string\"\n        },\n        \"mime\": {\n          \"type\": \"string\"\n        },\n        \"files\": {\n          \"type\": \"array\",\n          \"items\": {\n            \"type\": \"object\",\n            \"required\": [\n              \"name\",\n              \"mime\",\n              \"bytes\",\n              \"base64\"\n            ],\n            \"properties\": {\n              \"name\": {\n                \"type\": \"string\"\n              },\n              \"mime\": {\n                \"type\": \"string\"\n              },\n              \"bytes\": {\n                \"type\": \"integer\"\n              },\n              \"base64\": {\n                \"type\": \"string\",\n                \"contentEncoding\": \"base64\"\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n```\n\n## Limits and failures\n\nLimits below are enforced by this endpoint. Additional format, page, duration and model limits in the behavior notes also apply. Browser UI limits can differ from API limits.\n\n| Field | Value |\n| --- | --- |\n| `request_bytes` | 8388608 |\n| `input_characters` | 1000000 |\n| `files_bytes` | 5242880 |\n| `max_files` | 0 |\n| `timeout_seconds` | 12 |\n\nInvalid requests return an `error` object with `code` and `message`. Read [HTTP statuses, retries, timeouts and concurrency](https://happytails.ai/en/api/#limits). Execution is synchronous and results are returned in the response.\n\n## Complete request schema\n\n### Expand the JSON schema\n\n```json\n{\n  \"type\": \"object\",\n  \"additionalProperties\": false,\n  \"properties\": {\n    \"input\": {\n      \"type\": \"string\",\n      \"maxLength\": 1000000,\n      \"default\": \"\",\n      \"description\": \"Plain text input. File tools use files instead unless otherwise documented.\"\n    },\n    \"options\": {\n      \"type\": \"object\",\n      \"additionalProperties\": false,\n      \"properties\": {\n        \"direction\": {\n          \"type\": \"string\",\n          \"description\": \"Direction\",\n          \"default\": \"row\",\n          \"enum\": [\n            \"row\",\n            \"column\",\n            \"row-reverse\",\n            \"column-reverse\"\n          ]\n        },\n        \"justify\": {\n          \"type\": \"string\",\n          \"description\": \"Justify\",\n          \"default\": \"flex-start\",\n          \"enum\": [\n            \"flex-start\",\n            \"center\",\n            \"space-between\",\n            \"space-around\",\n            \"flex-end\"\n          ]\n        },\n        \"align\": {\n          \"type\": \"string\",\n          \"description\": \"Align\",\n          \"default\": \"stretch\",\n          \"enum\": [\n            \"stretch\",\n            \"center\",\n            \"flex-start\",\n            \"flex-end\"\n          ]\n        },\n        \"wrap\": {\n          \"type\": \"string\",\n          \"description\": \"Wrap\",\n          \"default\": \"wrap\",\n          \"enum\": [\n            \"wrap\",\n            \"nowrap\"\n          ]\n        },\n        \"gap\": {\n          \"type\": \"number\",\n          \"description\": \"Gap (px)\",\n          \"default\": 16.0\n        }\n      }\n    }\n  }\n}\n```\n\nFor browser automation, use the central [WebMCP guidance](https://happytails.ai/en/api/#browser-agents) and discover the tools actually exposed by the browser.\n\nRequest example\n\n### cURL\n\n```bash\ncurl https://happytails.ai/api/v1/tools/css-flexbox/run \\\n  -H \"Content-Type: application/json\" \\\n  --data '{\"options\": {\"direction\": \"row\", \"justify\": \"flex-start\", \"align\": \"stretch\", \"wrap\": \"wrap\", \"gap\": 16.0}}'\n```\n\n### JavaScript\n\n```javascript\nconst payload = {\n  \"options\": {\n    \"direction\": \"row\",\n    \"justify\": \"flex-start\",\n    \"align\": \"stretch\",\n    \"wrap\": \"wrap\",\n    \"gap\": 16.0\n  }\n};\n\nconst response = await fetch(\n  \"https://happytails.ai/api/v1/tools/css-flexbox/run\",\n  {\n    method: \"POST\",\n    headers: { \"Content-Type\": \"application/json\" },\n    body: JSON.stringify(payload)\n  }\n);\nconst data = await response.json();\nif (!response.ok) throw new Error(data.error.message);\nconsole.log(data.result);\n```\n\n### Python\n\n```python\nimport json\nfrom urllib.request import Request, urlopen\n\npayload = json.loads('{\"options\": {\"direction\": \"row\", \"justify\": \"flex-start\", \"align\": \"stretch\", \"wrap\": \"wrap\", \"gap\": 16.0}}')\n\nrequest = Request(\n    \"https://happytails.ai/api/v1/tools/css-flexbox/run\",\n    data=json.dumps(payload).encode(),\n    headers={\"Content-Type\": \"application/json\"},\n)\nwith urlopen(request, timeout=200) as response:\n    result = json.load(response)\n    print(result)\n```\n\n### JSON\n\n```json\n{\n  \"options\": {\n    \"direction\": \"row\",\n    \"justify\": \"flex-start\",\n    \"align\": \"stretch\",\n    \"wrap\": \"wrap\",\n    \"gap\": 16.0\n  }\n}\n```\n\nReplace the API origin and input values for your application.\n\n200 OK · response structure\n\n### JSON\n\n```json\n{\n  \"tool\": \"css-flexbox\",\n  \"result\": {\n    \"text\": null,\n    \"files\": []\n  }\n}\n```\n\nIllustrative envelope. Actual text, filename, MIME type and bytes depend on the result. See the complete output schema.\n\n400 Bad Request\n\n### JSON\n\n```json\n{\n  \"error\": {\n    \"code\": \"INVALID_INPUT\",\n    \"message\": \"Unknown request property. See the tool input schema.\"\n  }\n}\n```\n"
}