CLI, MCP and Icons

CLI, MCP and Icons

The Framework7 Ecosystem: CLI, MCP Server and Icons

Three official, MIT-licensed tools surround the framework.

Framework7 CLI 89 (github.com/framework7io/framework7-cli (https://github.com/framework7io/framework7-cli 89 )), version 9.0.2 (February 2026), installs with npm 2,036 install -g framework7-cli as two commands, framework7 and f7. framework7 create asks for the flavor, targets (web, PWA, Cordova 129 , Capacitor 243,123 ) and starter template; --ui opens the same builder in a browser on port 3001; framework7 assets regenerates icons and splash screens. BookNest Setup creates BookNest with it.

Framework7 572,986 MCP Server gives code editors and AI coding assistants the API reference through the Model Context Protocol. Register https://framework7.io/mcp 572,986 in your editor's MCP settings (VS Code 550 reads .vscode/mcp.json), and its nine tools, such as search-api, get-component and get-demo, answer from the current documentation instead of old tutorials. The protocol is JSON-RPC 2.0 over HTTP, so you can query it yourself:

Querying the Framework7 MCP server with curl and jq

f7mcp() {   # usage: f7mcp <tool-name> '<arguments as JSON>'
  jq -n --arg tool "$1" --argjson args "$2" \
    '{jsonrpc: "2.0", id: 1, method: "tools/call", params: {name: $tool, arguments: $args}}' |
  curl -s -X POST https://framework7.io/mcp -H "Content-Type: application/json" -d @- |
  jq -r '.result.content[0].text'
}
f7mcp list-components '{}' | jq length
f7mcp get-parameter '{"name": "mdColorScheme"}' |
  jq -r '"\(.component).\(.name) (\(.type))", .description'

Output

68
App.mdColorScheme (string)
Material color scheme. Can be `default`, `vibrant`, `monochrome` or `monochrome-vibrant`

Framework7 Icons 230 (github.com/framework7io/framework7-icons (https://github.com/framework7io/framework7-icons 230 ), npm install framework7-icons) is a font of about 1,250 iOS-style icons. It uses ligatures, so <i class="icon f7-icons">cart</i> drew the cart in the BookNest screenshots. For the Material theme the documentation recommends Google's Material Icons; put both icons in the markup with the if-ios and if-md classes, and Framework7 hides the one that does not match the active theme.

MENU