MCP File Preview Server
by seanivore
The MCP File Preview Server provides HTML file preview and analysis capabilities. It enables capturing full-page screenshots of local HTML files and analyzing their structure.
Last updated: N/A
What is MCP File Preview Server?
An MCP server designed to preview and analyze local HTML files. It allows users to capture screenshots of HTML files with CSS styling and analyze their structure.
How to use MCP File Preview Server?
- Clone the repository. 2. Install dependencies using
npm install
. 3. Build the project usingnpm run build
. 4. Configure the server in your Claude or Cline MCP settings, providing the path to the builtindex.js
file. 5. Use thepreview_file
tool to capture screenshots and theanalyze_content
tool to analyze HTML structure.
Key features of MCP File Preview Server
File Preview
Content Analysis
Local File Support
Screenshot Management
Use cases of MCP File Preview Server
Previewing HTML files for Claude or Cline
Analyzing HTML structure for content extraction
Generating screenshots of HTML content
Debugging HTML rendering issues
FAQ from MCP File Preview Server
What is MCP?
What is MCP?
MCP stands for Model Context Protocol, a framework for integrating external tools with language models.
Where are the screenshots saved?
Where are the screenshots saved?
Screenshots are saved to the screenshots/
directory in the project folder.
What analysis does analyze_content
perform?
What analysis does analyze_content
perform?
The analyze_content
tool counts the number of headings, paragraphs, images, and links in the HTML file.
How do I debug the server?
How do I debug the server?
Use the MCP Inspector and check Claude OS logs if tools don't appear in the dropdown.
What are the requirements for development?
What are the requirements for development?
Install the development dependencies listed in the README and use the npm run build
command to build the project.