Servers Playground How we check Add a server Log in

Systra Tools

Working · 3.3 s

tools.systra/systra-toolsv1.0.0 Domain verified

Search and pull 500+ production-ready React + Tailwind sections and elements

Developer Tools

Source Website Registry entry

Maintain this server? Claim it

Try it

Call this server's tools from your browser. Nothing to install.

https://systra.tools/api/mcp

Authorization (required)

Bearer token. Create a key at https://systra.tools/mcp

Requests go through mcptry because browsers can't call most MCP servers directly. Header values are sent to the server for that request only and are never stored or logged.

Tool list from our last check. Connect live to refresh it.

get_component

Returns the complete, copy-ready React/TSX source of a component by its name.

namestring, required

Component name, e.g. 'OrbitGalleryHero'.

This tool isn't marked read-only, so it may change something on the server or in an account you connected.

I understand, run it anyway

Systra Tools MCP server | mcptry

Tools (13)

get_component

Returns the complete, copy-ready React/TSX source of a component by its name.

Argument	Type	Description
name*	string	Component name, e.g. 'OrbitGalleryHero'.

Input schema (JSON)

{
  "type": "object",
  "required": [
    "name"
  ],
  "properties": {
    "name": {
      "type": "string",
      "description": "Component name, e.g. 'OrbitGalleryHero'."
    }
  },
  "additionalProperties": false
}

get_component_styled

Returns a component together with the design tokens of a brand style and precise instructions for adapting it, so the component lands directly in your own brand look.

Argument	Type	Description
name*	string	Component name, e.g. 'GradientHeroSection'.
style*	string	Style slug from list_styles.

Input schema (JSON)

{
  "type": "object",
  "required": [
    "name",
    "style"
  ],
  "properties": {
    "name": {
      "type": "string",
      "description": "Component name, e.g. 'GradientHeroSection'."
    },
    "style": {
      "type": "string",
      "description": "Style slug from list_styles."
    }
  },
  "additionalProperties": false
}

get_post

Returns a post template as a complete set of working instructions: the HTML file, the export script and the rules on what may be changed. With it the post can be rebuilt and rendered directly.

Argument	Type	Description
lang	string	Language of the instructions. English without one.
slug*	string	Slug of the template, see list_posts.

Input schema (JSON)

{
  "type": "object",
  "required": [
    "slug"
  ],
  "properties": {
    "lang": {
      "enum": [
        "de",
        "en"
      ],
      "type": "string",
      "description": "Language of the instructions. English without one."
    },
    "slug": {
      "type": "string",
      "description": "Slug of the template, see list_posts."
    }
  },
  "additionalProperties": false
}

get_recipe

Returns a page recipe: the sequence of sections with the purpose of each one and the complete source of every section. Optionally in the look of a brand style.

Argument	Type	Description
name*	string	Recipe slug from list_recipes, e.g. 'saas-landing'.
style	string	Optional style slug from list_styles.

Input schema (JSON)

{
  "type": "object",
  "required": [
    "name"
  ],
  "properties": {
    "name": {
      "type": "string",
      "description": "Recipe slug from list_recipes, e.g. 'saas-landing'."
    },
    "style": {
      "type": "string",
      "description": "Optional style slug from list_styles."
    }
  },
  "additionalProperties": false
}

get_style

Returns every design token of an extracted brand style: colours, typography, CSS variables and the generated DESIGN.md.

Argument	Type	Description
slug*	string	Style slug from list_styles.

Input schema (JSON)

{
  "type": "object",
  "required": [
    "slug"
  ],
  "properties": {
    "slug": {
      "type": "string",
      "description": "Style slug from list_styles."
    }
  },
  "additionalProperties": false
}

list_categories

Lists every category of Systra Tools with the number of components in it.

No arguments.

Input schema (JSON)

{
  "type": "object",
  "properties": {},
  "additionalProperties": false
}

list_components

Lists components of the library. Optionally filtered by category slug ('heros', 'forms', 'cta').

Argument	Type	Description
category	string	Category slug to filter by (optional).

Input schema (JSON)

{
  "type": "object",
  "properties": {
    "category": {
      "type": "string",
      "description": "Category slug to filter by (optional)."
    }
  },
  "additionalProperties": false
}

list_images

Lists the images of the Systra Tools media library (all AI-generated) with ready, permanently valid URLs to drop straight in. Optionally filtered by album and format, 100 per page.

Argument	Type	Description
page	integer	Page of the result, 100 images per page (optional, default 1).
album	string	Album key to filter by (optional), e.g. 'natur', 'business', 'abstrakt'. Without one, every album is returned.
format	string	Image format to filter by (optional).

Input schema (JSON)

{
  "type": "object",
  "properties": {
    "page": {
      "type": "integer",
      "minimum": 1,
      "description": "Page of the result, 100 images per page (optional, default 1)."
    },
    "album": {
      "type": "string",
      "description": "Album key to filter by (optional), e.g. 'natur', 'business', 'abstrakt'. Without one, every album is returned."
    },
    "format": {
      "enum": [
        "landscape",
        "portrait",
        "square"
      ],
      "type": "string",
      "description": "Image format to filter by (optional)."
    }
  },
  "additionalProperties": false
}

list_posts

Lists the Instagram post templates of Systra Tools (1080 x 1350). Every template is a single HTML file that can be rebuilt and exported as an image or a video.

Argument	Type	Description
family	string	Family to filter by (optional): 'klar' are calm informational posts, 'editorial' lives on the image and a serif face.

Input schema (JSON)

{
  "type": "object",
  "properties": {
    "family": {
      "enum": [
        "klar",
        "editorial"
      ],
      "type": "string",
      "description": "Family to filter by (optional): 'klar' are calm informational posts, 'editorial' lives on the image and a serif face."
    }
  },
  "additionalProperties": false
}

list_recipes

Lists curated page recipes: sensible sequences of sections for complete landing pages (SaaS, coaching, hotel and so on).

No arguments.

Input schema (JSON)

{
  "type": "object",
  "properties": {},
  "additionalProperties": false
}

list_styles

Lists the brand styles extracted with the style extractor (colours and fonts of real websites) that can be applied to components.

No arguments.

Input schema (JSON)

{
  "type": "object",
  "properties": {},
  "additionalProperties": false
}

search_components

Searches components by a keyword in the name or the category and returns the matches.

Argument	Type	Description
query*	string	Search term.

Input schema (JSON)

{
  "type": "object",
  "required": [
    "query"
  ],
  "properties": {
    "query": {
      "type": "string",
      "description": "Search term."
    }
  },
  "additionalProperties": false
}

search_images

Searches the media library (all images AI-generated) by keywords in the title, the tags, the file name or the album and returns ready URLs, 100 per page.

Argument	Type	Description
page	integer	Page of the result, 100 images per page (optional, default 1).
query*	string	Search term, e.g. 'gradient', 'laptop', 'wald'.

Input schema (JSON)

{
  "type": "object",
  "required": [
    "query"
  ],
  "properties": {
    "page": {
      "type": "integer",
      "minimum": 1,
      "description": "Page of the result, 100 images per page (optional, default 1)."
    },
    "query": {
      "type": "string",
      "description": "Search term, e.g. 'gradient', 'laptop', 'wald'."
    }
  },
  "additionalProperties": false
}