### Initialize MCP Server for VSCode
Source: https://svgl.app/docs/shadcn-ui
This command initializes the shadcn MCP server with the 'vscode' client. Following this, you should open .vscode/mcp.json and click 'Start' next to the shadcn server.
```bash
pnpm dlx shadcn@latest mcp init --client vscode
```
--------------------------------
### Get all SVGs
Source: https://svgl.app/docs/api
Retrieves a list of all SVGs available in the repository.
```APIDOC
## GET /
### Description
Retrieves a list of all SVGs available in the repository.
### Method
GET
### Endpoint
/
### Parameters
#### Query Parameters
- **limit** (integer) - Optional - The maximum number of SVGs to return.
### Request Example
```json
{
"example": "GET https://api.svgl.app"
}
```
### Response
#### Success Response (200)
- **id** (integer) - The unique identifier of the SVG.
- **title** (string) - The title of the SVG.
- **category** (string or array of strings) - The category or categories the SVG belongs to.
- **route** (string or object) - The route to the SVG file, or an object with light and dark theme routes.
- **url** (string) - The URL associated with the SVG.
- **wordmark** (string or object) - Optional. The route to the wordmark, or an object with light and dark theme routes.
- **brandUrl** (string) - Optional. The brand URL associated with the SVG.
#### Response Example
```json
[
{
"id": 0,
"title": "Discord",
"category": "Software",
"route": "https://svgl.app/discord.svg",
"url": "https://discord.com/"
}
]
```
```
--------------------------------
### Get the list of categories
Source: https://svgl.app/docs/api
Retrieves a list of all available categories and the total count of SVGs in each.
```APIDOC
## GET /categories
### Description
Retrieves a list of all available categories and the total count of SVGs within each category.
### Method
GET
### Endpoint
/categories
### Parameters
None
### Request Example
```json
{
"example": "GET https://api.svgl.app/categories"
}
```
### Response
#### Success Response (200)
- **category** (string) - The name of the category.
- **total** (integer) - The total number of SVGs in that category.
#### Response Example
```json
[
{
"category": "Software",
"total": 97
},
{
"category": "Library",
"total": 25
}
]
```
```
--------------------------------
### Get All SVGs Endpoint
Source: https://svgl.app/docs/api
Retrieves a list of all available SVGs from the repository. The response is a JSON array of SVG objects.
```http
https://api.svgl.app
```
```json
// Returns:
[
{
"id": 0,
"title": "Discord",
"category": "Software",
"route": "https://svgl.app/discord.svg",
"url": "https://discord.com/"
},
...
]
```
--------------------------------
### Get SVGs by category
Source: https://svgl.app/docs/api
Retrieves a list of SVGs filtered by a specific category.
```APIDOC
## GET /category/{categoryName}
### Description
Retrieves a list of SVGs filtered by a specific category.
### Method
GET
### Endpoint
/category/{categoryName}
### Parameters
#### Path Parameters
- **categoryName** (string) - Required - The name of the category to filter by.
### Request Example
```json
{
"example": "GET https://api.svgl.app/category/software"
}
```
### Response
#### Success Response (200)
- **id** (integer) - The unique identifier of the SVG.
- **title** (string) - The title of the SVG.
- **category** (string or array of strings) - The category or categories the SVG belongs to.
- **route** (string or object) - The route to the SVG file, or an object with light and dark theme routes.
- **url** (string) - The URL associated with the SVG.
- **wordmark** (string or object) - Optional. The route to the wordmark, or an object with light and dark theme routes.
- **brandUrl** (string) - Optional. The brand URL associated with the SVG.
#### Response Example
```json
[
{
"id": 0,
"title": "Discord",
"category": "Software",
"route": "https://svgl.app/discord.svg",
"url": "https://discord.com/"
}
]
```
```
--------------------------------
### Get All SVGs with Limit Endpoint
Source: https://svgl.app/docs/api
Fetches a specified number of SVGs from the repository. A 'limit' query parameter controls the number of results returned in the JSON array.
```http
https://api.svgl.app?limit=10
```
```json
// Returns:
[
{
"id": 0,
"title": "Discord",
"category": "Software",
"route": "https://svgl.app/discord.svg",
"url": "https://discord.com/"
},
...
]
```
--------------------------------
### Get List of Categories Endpoint
Source: https://svgl.app/docs/api
Retrieves a list of all available categories for SVGs. The response is a JSON array, where each object contains the category name and the total count of SVGs within that category.
```http
https://api.svgl.app/categories
```
```json
// Returns:
[
{
"category": "Software",
"total": 97
},
{
"category": "Library",
"total": 25
}
//...
]
```
--------------------------------
### Get the SVG code
Source: https://svgl.app/docs/api
Retrieves the SVG code for a specific SVG, with an option to disable optimization.
```APIDOC
## GET /svg/{svgName}
### Description
Retrieves the SVG code for a specific SVG. By default, the SVG is optimized using svgo. Append `?no-optimize` to get the unoptimized version.
### Method
GET
### Endpoint
/svg/{svgName}
### Parameters
#### Path Parameters
- **svgName** (string) - Required - The name of the SVG file (e.g., `adobe.svg`).
#### Query Parameters
- **no-optimize** (boolean) - Optional - If present, the SVG will not be optimized.
### Request Example
```json
{
"example": "GET https://api.svgl.app/svg/adobe.svg?no-optimize"
}
```
### Response
#### Success Response (200)
- Returns the SVG code as an XML string.
#### Response Example
```xml
```
```
--------------------------------
### Get SVG Code Endpoint
Source: https://svgl.app/docs/api
Fetches the SVG code for a specific SVG file. By default, the SVG is optimized using svgo. An optional 'no-optimize' query parameter can be added to retrieve the unoptimized version.
```http
https://api.svgl.app/svg/adobe.svg
```
```http
https://api.svgl.app/svg/adobe.svg?no-optimize
```
```xml
```
--------------------------------
### Get SVGs by Category Endpoint
Source: https://svgl.app/docs/api
Retrieves a list of SVGs belonging to a specific category. The category name is appended to the base URL, and the response is a JSON array of matching SVG objects.
```http
https://api.svgl.app/category/software
```
```json
// Returns:
[
{
"id": 0,
"title": "Discord",
"category": "Software",
"route": "https://svgl.app/discord.svg",
"url": "https://discord.com/"
},
...
]
```
--------------------------------
### Initialize MCP Server for Cursor
Source: https://svgl.app/docs/shadcn-ui
This command initializes the shadcn MCP server with the 'cursor' client. After execution, you need to enable the MCP server within Cursor's settings.
```bash
pnpm dlx shadcn@latest mcp init --client cursor
```
--------------------------------
### Initialize MCP Server for Claude Code
Source: https://svgl.app/docs/shadcn-ui
This command initializes the shadcn MCP server with the 'claude' client. After running this, you need to restart Claude Code and can then use the /mcp command for debugging.
```bash
pnpm dlx shadcn@latest mcp init --client claude
```
--------------------------------
### Add Multiple SVGs using shadcn/ui CLI
Source: https://svgl.app/docs/shadcn-ui
Shows how to add multiple SVGs from the SVGL registry simultaneously using the shadcn/ui CLI with pnpm. This is useful for adding several icons at once.
```bash
pnpm dlx shadcn@latest add @svgl/sanity @svgl/github @svgl/supabase @svgl/vercel
```
--------------------------------
### Add Single SVG using shadcn/ui CLI
Source: https://svgl.app/docs/shadcn-ui
Demonstrates how to add a single SVG from the SVGL registry to your project using the shadcn/ui CLI. This command can be executed with npm, yarn, bun, or pnpm.
```bash
npx shadcn@latest add @svgl/sanity
```
```bash
pnpm dlx shadcn@latest add @svgl/sanity
```
```bash
yarn dlx shadcn@latest add @svgl/sanity
```
```bash
bunx shadcn@latest add @svgl/sanity
```
--------------------------------
### Add SVGL Registry to shadcn/ui
Source: https://svgl.app/docs/shadcn-ui
This JSON snippet shows how to add the SVGL registry to your shadcn/ui components.json file. This is a prerequisite for using the shadcn/ui CLI to add SVGs from the SVGL registry.
```json
{
"registries": {
"@svgl": "https://svgl.app/r/{name}.json"
}
}
```
--------------------------------
### Search SVG by title
Source: https://svgl.app/docs/api
Searches for SVGs by their title.
```APIDOC
## GET /
### Description
Searches for SVGs by their title. This endpoint uses the same base URL as getting all SVGs, but with a `search` query parameter.
### Method
GET
### Endpoint
/
### Parameters
#### Query Parameters
- **search** (string) - Required - The title or part of the title to search for.
- **limit** (integer) - Optional - The maximum number of SVGs to return.
### Request Example
```json
{
"example": "GET https://api.svgl.app?search=axiom"
}
```
### Response
#### Success Response (200)
- **id** (integer) - The unique identifier of the SVG.
- **title** (string) - The title of the SVG.
- **category** (string or array of strings) - The category or categories the SVG belongs to.
- **route** (string or object) - The route to the SVG file, or an object with light and dark theme routes.
- **url** (string) - The URL associated with the SVG.
- **wordmark** (string or object) - Optional. The route to the wordmark, or an object with light and dark theme routes.
- **brandUrl** (string) - Optional. The brand URL associated with the SVG.
#### Response Example
```json
[
{
"id": 267,
"title": "Axiom",
"category": "Software",
"route": {
"light": "https://svgl.app/axiom-light.svg",
"dark": "https://svgl.app/axiom-dark.svg"
},
"url": "https://axiom.co/"
}
]
```
```
--------------------------------
### TypeScript Types for SVG Responses
Source: https://svgl.app/docs/api
Defines the structure for SVG data returned by the API, including properties like id, title, category, route, and URL. It also includes types for theme options and an interface for the SVG object itself.
```typescript
export type ThemeOptions = {
dark: string;
light: string;
};
export interface SVG {
id: number;
title: string;
category: string | string[];
route: string | ThemeOptions;
url: string;
wordmark?: string | ThemeOptions;
brandUrl?: string;
}
```
--------------------------------
### Search SVG by Title Endpoint
Source: https://svgl.app/docs/api
Searches for SVGs based on their title. The search term is provided as a 'search' query parameter, and the response is a JSON array of matching SVG objects.
```http
https://api.svgl.app?search=axiom
```
```json
// Returns:
[
{
"id": 267,
"title": "Axiom",
"category": "Software",
"route": {
"light": "https://svgl.app/axiom-light.svg",
"dark": "https://svgl.app/axiom-dark.svg"
},
"url": "https://axiom.co/"
}
]
```
=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.