API Reference

Backend API documentation

• getAPI Connection Test
• postGenerate Single Page Mockup
• postGenerate Multiple Mockups
• postGenerate Component Variations
• getReal-time Collaboration WebSocket

API docs by Redocly

Sketch to Screen API (1.0.0)

Download OpenAPI specification:Download

API documentation for the backend services handling sketch-to-HTML generation, component variations, and real-time collaboration.

API Connection Test

Simple test endpoint to verify frontend-backend connection.

Responses

REST API Base URL

http://localhost:8000/api/

WebSocket Base URL

ws://localhost:8000/

Response samples

• 200

Content type

application/json

{

• "status": "success",
• "message": "Backend is connected!",
• "method": "GET"

}

Generate Single Page Mockup

Uploads a single sketch image and converts it into HTML/CSS code.

Request Body schema: multipart/form-data

required

file required	string <binary> The sketch image file (PNG/JPG). Max size 10MB.
prompt	string Optional text prompt to guide the generation.

Responses

REST API Base URL

http://localhost:8000/api/generate/

WebSocket Base URL

ws://localhost:8000/generate/

Response samples

• 200

Content type

application/json

{

• "html": "string"

}

Generate Multiple Mockups

Uploads multiple sketch images to generate multiple HTML pages in parallel. Note: Files must be indexed (file_0, file_1, etc.).

Request Body schema: multipart/form-data

required

count required	integer [ 1 .. 20 ] Total number of files being uploaded (1-20).
file_0	string <binary> First file upload. Pattern: file_{i}
name_0	string Name for the first page. Pattern: name_{i}
id=0	string ID for the first page. Pattern: id={i}

Responses

REST API Base URL

http://localhost:8000/api/generate-multi/

WebSocket Base URL

ws://localhost:8000/generate-multi/

Response samples

• 200

Content type

application/json

{

• "results": [

  • {

    • "id": "string",
    • "html": "string",
    • "error": "string"

    }

  ]

}

Generate Component Variations

Generates design variations for a specific HTML element/component.

Request Body schema: application/json

required

element_html required	string The HTML code of the component to modify.
element_type	string Default: "component" Type of element (e.g., 'button', 'card').
prompt	string Custom instructions for the variation (e.g., 'Make it darker').
count	integer [ 1 .. 10 ] Default: 3 Number of variations to generate.

Responses

REST API Base URL

http://localhost:8000/api/generate-variations/

WebSocket Base URL

ws://localhost:8000/generate-variations/

Request samples

• Payload

Content type

application/json

{

• "element_html": "string",
• "element_type": "component",
• "prompt": "string",
• "count": 3

}

Response samples

• 200

Content type

application/json

{

• "variations": [

  • "string"

  ]

}

Real-time Collaboration WebSocket

Initiates a WebSocket connection for real-time collaboration on a specific sketch session. Connect using 'ws://' or 'wss://'.

path Parameters

collabID required

string^\d+$ Unique numeric ID of the collaboration session

Responses

REST API Base URL

http://localhost:8000/api/ws/collab/{collabID}/

WebSocket Base URL

ws://localhost:8000/ws/collab/{collabID}/