CSS Clip-Path Generator
curl --request POST \
--url https://api.iotools.cloud/v1/tool/css-clip-path-generator \
--header 'Authorization: Bearer <token>' \
--header 'Content-Type: application/json' \
--data '
{
"ioCircleRadius": 50.5,
"ioCircleCx": 50,
"ioCircleCy": 50,
"ioEllipseRx": 50.5,
"ioEllipseRy": 50.5,
"ioEllipseCx": 50,
"ioEllipseCy": 50,
"ioInsetTop": 50,
"ioInsetRight": 50,
"ioInsetBottom": 50,
"ioInsetLeft": 50,
"ioInsetRound": 25,
"ioPolygonPoints": "<string>"
}
'import requests
url = "https://api.iotools.cloud/v1/tool/css-clip-path-generator"
payload = {
"ioCircleRadius": 50.5,
"ioCircleCx": 50,
"ioCircleCy": 50,
"ioEllipseRx": 50.5,
"ioEllipseRy": 50.5,
"ioEllipseCx": 50,
"ioEllipseCy": 50,
"ioInsetTop": 50,
"ioInsetRight": 50,
"ioInsetBottom": 50,
"ioInsetLeft": 50,
"ioInsetRound": 25,
"ioPolygonPoints": "<string>"
}
headers = {
"Authorization": "Bearer <token>",
"Content-Type": "application/json"
}
response = requests.post(url, json=payload, headers=headers)
print(response.text)const options = {
method: 'POST',
headers: {Authorization: 'Bearer <token>', 'Content-Type': 'application/json'},
body: JSON.stringify({
ioCircleRadius: 50.5,
ioCircleCx: 50,
ioCircleCy: 50,
ioEllipseRx: 50.5,
ioEllipseRy: 50.5,
ioEllipseCx: 50,
ioEllipseCy: 50,
ioInsetTop: 50,
ioInsetRight: 50,
ioInsetBottom: 50,
ioInsetLeft: 50,
ioInsetRound: 25,
ioPolygonPoints: '<string>'
})
};
fetch('https://api.iotools.cloud/v1/tool/css-clip-path-generator', options)
.then(res => res.json())
.then(res => console.log(res))
.catch(err => console.error(err));<?php
$curl = curl_init();
curl_setopt_array($curl, [
CURLOPT_URL => "https://api.iotools.cloud/v1/tool/css-clip-path-generator",
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => "",
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 30,
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => "POST",
CURLOPT_POSTFIELDS => json_encode([
'ioCircleRadius' => 50.5,
'ioCircleCx' => 50,
'ioCircleCy' => 50,
'ioEllipseRx' => 50.5,
'ioEllipseRy' => 50.5,
'ioEllipseCx' => 50,
'ioEllipseCy' => 50,
'ioInsetTop' => 50,
'ioInsetRight' => 50,
'ioInsetBottom' => 50,
'ioInsetLeft' => 50,
'ioInsetRound' => 25,
'ioPolygonPoints' => '<string>'
]),
CURLOPT_HTTPHEADER => [
"Authorization: Bearer <token>",
"Content-Type: application/json"
],
]);
$response = curl_exec($curl);
$err = curl_error($curl);
curl_close($curl);
if ($err) {
echo "cURL Error #:" . $err;
} else {
echo $response;
}package main
import (
"fmt"
"strings"
"net/http"
"io"
)
func main() {
url := "https://api.iotools.cloud/v1/tool/css-clip-path-generator"
payload := strings.NewReader("{\n \"ioCircleRadius\": 50.5,\n \"ioCircleCx\": 50,\n \"ioCircleCy\": 50,\n \"ioEllipseRx\": 50.5,\n \"ioEllipseRy\": 50.5,\n \"ioEllipseCx\": 50,\n \"ioEllipseCy\": 50,\n \"ioInsetTop\": 50,\n \"ioInsetRight\": 50,\n \"ioInsetBottom\": 50,\n \"ioInsetLeft\": 50,\n \"ioInsetRound\": 25,\n \"ioPolygonPoints\": \"<string>\"\n}")
req, _ := http.NewRequest("POST", url, payload)
req.Header.Add("Authorization", "Bearer <token>")
req.Header.Add("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)
defer res.Body.Close()
body, _ := io.ReadAll(res.Body)
fmt.Println(string(body))
}HttpResponse<String> response = Unirest.post("https://api.iotools.cloud/v1/tool/css-clip-path-generator")
.header("Authorization", "Bearer <token>")
.header("Content-Type", "application/json")
.body("{\n \"ioCircleRadius\": 50.5,\n \"ioCircleCx\": 50,\n \"ioCircleCy\": 50,\n \"ioEllipseRx\": 50.5,\n \"ioEllipseRy\": 50.5,\n \"ioEllipseCx\": 50,\n \"ioEllipseCy\": 50,\n \"ioInsetTop\": 50,\n \"ioInsetRight\": 50,\n \"ioInsetBottom\": 50,\n \"ioInsetLeft\": 50,\n \"ioInsetRound\": 25,\n \"ioPolygonPoints\": \"<string>\"\n}")
.asString();require 'uri'
require 'net/http'
url = URI("https://api.iotools.cloud/v1/tool/css-clip-path-generator")
http = Net::HTTP.new(url.host, url.port)
http.use_ssl = true
request = Net::HTTP::Post.new(url)
request["Authorization"] = 'Bearer <token>'
request["Content-Type"] = 'application/json'
request.body = "{\n \"ioCircleRadius\": 50.5,\n \"ioCircleCx\": 50,\n \"ioCircleCy\": 50,\n \"ioEllipseRx\": 50.5,\n \"ioEllipseRy\": 50.5,\n \"ioEllipseCx\": 50,\n \"ioEllipseCy\": 50,\n \"ioInsetTop\": 50,\n \"ioInsetRight\": 50,\n \"ioInsetBottom\": 50,\n \"ioInsetLeft\": 50,\n \"ioInsetRound\": 25,\n \"ioPolygonPoints\": \"<string>\"\n}"
response = http.request(request)
puts response.read_body{
"tool": "<string>",
"tool_version": "<string>",
"outputs": {
"ioCssCode": "<string>",
"ioPreviewHtml": "<string>"
},
"credits_used": 123,
"request_id": "<string>",
"credits_remaining": 123
}{
"type": "https://iotools.cloud/docs/errors/validation_error",
"title": "Invalid request",
"status": 400,
"code": "validation_error",
"detail": "One or more inputs are invalid — see `fields`.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/invalid_api_key",
"title": "Invalid API key",
"status": 401,
"code": "invalid_api_key",
"detail": "Provide 'Authorization: Bearer <key>'.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/insufficient_credits",
"title": "Insufficient credits",
"status": 402,
"code": "insufficient_credits",
"detail": "This call costs 1 credit and 0 remain in this month's allowance.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/tool_not_allowed",
"title": "Tool not available over the API",
"status": 403,
"code": "tool_not_allowed",
"detail": "\"Background Remover\" is available on iotools.cloud but has no API endpoint.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/tool_not_found",
"title": "Tool not found",
"status": 404,
"code": "tool_not_found",
"detail": "No tool with that slug. See GET /v1/tools.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/payload_too_large",
"title": "Payload too large",
"status": 413,
"code": "payload_too_large",
"detail": "Request body exceeds this tool's size limit.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/rate_limited",
"title": "Rate limit exceeded",
"status": 429,
"code": "rate_limited",
"detail": "Too many requests. Retry in 30s.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/processing_error",
"title": "Tool failed to run",
"status": 500,
"code": "processing_error",
"detail": "The tool failed to run. Please try again.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/tool_disabled",
"title": "Tool temporarily disabled",
"status": 503,
"code": "tool_disabled",
"detail": "This tool is temporarily unavailable. Try again shortly.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}Generators
CSS Clip-Path Generator
Generate a CSS clip-path declaration — circle, ellipse, inset, or a polygon shape (triangle, hexagon, star, arrow, and more) with a hand-editable custom point list — with a live preview of the clipped shape.
POST
/
v1
/
tool
/
css-clip-path-generator
CSS Clip-Path Generator
curl --request POST \
--url https://api.iotools.cloud/v1/tool/css-clip-path-generator \
--header 'Authorization: Bearer <token>' \
--header 'Content-Type: application/json' \
--data '
{
"ioCircleRadius": 50.5,
"ioCircleCx": 50,
"ioCircleCy": 50,
"ioEllipseRx": 50.5,
"ioEllipseRy": 50.5,
"ioEllipseCx": 50,
"ioEllipseCy": 50,
"ioInsetTop": 50,
"ioInsetRight": 50,
"ioInsetBottom": 50,
"ioInsetLeft": 50,
"ioInsetRound": 25,
"ioPolygonPoints": "<string>"
}
'import requests
url = "https://api.iotools.cloud/v1/tool/css-clip-path-generator"
payload = {
"ioCircleRadius": 50.5,
"ioCircleCx": 50,
"ioCircleCy": 50,
"ioEllipseRx": 50.5,
"ioEllipseRy": 50.5,
"ioEllipseCx": 50,
"ioEllipseCy": 50,
"ioInsetTop": 50,
"ioInsetRight": 50,
"ioInsetBottom": 50,
"ioInsetLeft": 50,
"ioInsetRound": 25,
"ioPolygonPoints": "<string>"
}
headers = {
"Authorization": "Bearer <token>",
"Content-Type": "application/json"
}
response = requests.post(url, json=payload, headers=headers)
print(response.text)const options = {
method: 'POST',
headers: {Authorization: 'Bearer <token>', 'Content-Type': 'application/json'},
body: JSON.stringify({
ioCircleRadius: 50.5,
ioCircleCx: 50,
ioCircleCy: 50,
ioEllipseRx: 50.5,
ioEllipseRy: 50.5,
ioEllipseCx: 50,
ioEllipseCy: 50,
ioInsetTop: 50,
ioInsetRight: 50,
ioInsetBottom: 50,
ioInsetLeft: 50,
ioInsetRound: 25,
ioPolygonPoints: '<string>'
})
};
fetch('https://api.iotools.cloud/v1/tool/css-clip-path-generator', options)
.then(res => res.json())
.then(res => console.log(res))
.catch(err => console.error(err));<?php
$curl = curl_init();
curl_setopt_array($curl, [
CURLOPT_URL => "https://api.iotools.cloud/v1/tool/css-clip-path-generator",
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => "",
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 30,
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => "POST",
CURLOPT_POSTFIELDS => json_encode([
'ioCircleRadius' => 50.5,
'ioCircleCx' => 50,
'ioCircleCy' => 50,
'ioEllipseRx' => 50.5,
'ioEllipseRy' => 50.5,
'ioEllipseCx' => 50,
'ioEllipseCy' => 50,
'ioInsetTop' => 50,
'ioInsetRight' => 50,
'ioInsetBottom' => 50,
'ioInsetLeft' => 50,
'ioInsetRound' => 25,
'ioPolygonPoints' => '<string>'
]),
CURLOPT_HTTPHEADER => [
"Authorization: Bearer <token>",
"Content-Type: application/json"
],
]);
$response = curl_exec($curl);
$err = curl_error($curl);
curl_close($curl);
if ($err) {
echo "cURL Error #:" . $err;
} else {
echo $response;
}package main
import (
"fmt"
"strings"
"net/http"
"io"
)
func main() {
url := "https://api.iotools.cloud/v1/tool/css-clip-path-generator"
payload := strings.NewReader("{\n \"ioCircleRadius\": 50.5,\n \"ioCircleCx\": 50,\n \"ioCircleCy\": 50,\n \"ioEllipseRx\": 50.5,\n \"ioEllipseRy\": 50.5,\n \"ioEllipseCx\": 50,\n \"ioEllipseCy\": 50,\n \"ioInsetTop\": 50,\n \"ioInsetRight\": 50,\n \"ioInsetBottom\": 50,\n \"ioInsetLeft\": 50,\n \"ioInsetRound\": 25,\n \"ioPolygonPoints\": \"<string>\"\n}")
req, _ := http.NewRequest("POST", url, payload)
req.Header.Add("Authorization", "Bearer <token>")
req.Header.Add("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)
defer res.Body.Close()
body, _ := io.ReadAll(res.Body)
fmt.Println(string(body))
}HttpResponse<String> response = Unirest.post("https://api.iotools.cloud/v1/tool/css-clip-path-generator")
.header("Authorization", "Bearer <token>")
.header("Content-Type", "application/json")
.body("{\n \"ioCircleRadius\": 50.5,\n \"ioCircleCx\": 50,\n \"ioCircleCy\": 50,\n \"ioEllipseRx\": 50.5,\n \"ioEllipseRy\": 50.5,\n \"ioEllipseCx\": 50,\n \"ioEllipseCy\": 50,\n \"ioInsetTop\": 50,\n \"ioInsetRight\": 50,\n \"ioInsetBottom\": 50,\n \"ioInsetLeft\": 50,\n \"ioInsetRound\": 25,\n \"ioPolygonPoints\": \"<string>\"\n}")
.asString();require 'uri'
require 'net/http'
url = URI("https://api.iotools.cloud/v1/tool/css-clip-path-generator")
http = Net::HTTP.new(url.host, url.port)
http.use_ssl = true
request = Net::HTTP::Post.new(url)
request["Authorization"] = 'Bearer <token>'
request["Content-Type"] = 'application/json'
request.body = "{\n \"ioCircleRadius\": 50.5,\n \"ioCircleCx\": 50,\n \"ioCircleCy\": 50,\n \"ioEllipseRx\": 50.5,\n \"ioEllipseRy\": 50.5,\n \"ioEllipseCx\": 50,\n \"ioEllipseCy\": 50,\n \"ioInsetTop\": 50,\n \"ioInsetRight\": 50,\n \"ioInsetBottom\": 50,\n \"ioInsetLeft\": 50,\n \"ioInsetRound\": 25,\n \"ioPolygonPoints\": \"<string>\"\n}"
response = http.request(request)
puts response.read_body{
"tool": "<string>",
"tool_version": "<string>",
"outputs": {
"ioCssCode": "<string>",
"ioPreviewHtml": "<string>"
},
"credits_used": 123,
"request_id": "<string>",
"credits_remaining": 123
}{
"type": "https://iotools.cloud/docs/errors/validation_error",
"title": "Invalid request",
"status": 400,
"code": "validation_error",
"detail": "One or more inputs are invalid — see `fields`.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/invalid_api_key",
"title": "Invalid API key",
"status": 401,
"code": "invalid_api_key",
"detail": "Provide 'Authorization: Bearer <key>'.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/insufficient_credits",
"title": "Insufficient credits",
"status": 402,
"code": "insufficient_credits",
"detail": "This call costs 1 credit and 0 remain in this month's allowance.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/tool_not_allowed",
"title": "Tool not available over the API",
"status": 403,
"code": "tool_not_allowed",
"detail": "\"Background Remover\" is available on iotools.cloud but has no API endpoint.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/tool_not_found",
"title": "Tool not found",
"status": 404,
"code": "tool_not_found",
"detail": "No tool with that slug. See GET /v1/tools.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/payload_too_large",
"title": "Payload too large",
"status": 413,
"code": "payload_too_large",
"detail": "Request body exceeds this tool's size limit.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/rate_limited",
"title": "Rate limit exceeded",
"status": 429,
"code": "rate_limited",
"detail": "Too many requests. Retry in 30s.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/processing_error",
"title": "Tool failed to run",
"status": 500,
"code": "processing_error",
"detail": "The tool failed to run. Please try again.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}{
"type": "https://iotools.cloud/docs/errors/tool_disabled",
"title": "Tool temporarily disabled",
"status": 503,
"code": "tool_disabled",
"detail": "This tool is temporarily unavailable. Try again shortly.",
"request_id": "e4042b29-8f1e-4c7a-9b52-6f0d1a3c7e11"
}Authorizations
Bearer authentication header of the form Bearer <token>, where <token> is your auth token.
Body
application/json
Shape
Available options:
circle, ellipse, inset, triangle, rhombus, pentagon, hexagon, octagon, star, message, arrow, cross, chevron, parallelogram, trapezoid, custom-polygon Radius %
Required range:
1 <= x <= 100Center X %
Required range:
0 <= x <= 100Center Y %
Required range:
0 <= x <= 100Radius X %
Required range:
1 <= x <= 100Radius Y %
Required range:
1 <= x <= 100Center X %
Required range:
0 <= x <= 100Center Y %
Required range:
0 <= x <= 100Top %
Required range:
0 <= x <= 100Right %
Required range:
0 <= x <= 100Bottom %
Required range:
0 <= x <= 100Left %
Required range:
0 <= x <= 100Corner Radius %
Required range:
0 <= x <= 50Polygon Points
Response
Tool output
Output-contract version for this tool. Currently "1" for all tools.
Show child attributes
Show child attributes
Credits this call consumed, after any settlement refund. 0 when metering is disabled.
Credits left in the current monthly allowance, or null when metering is disabled.
Was this page helpful?
⌘I