# Documentation
Comprehensive documentation for the Figma MCP Server.
## Available Guides
### [TROUBLESHOOTING.md](./TROUBLESHOOTING.md)
Common issues and their solutions.
**Topics covered:**
- Authentication errors
- Token validation
- Node access issues
- API rate limits
- Common error messages
**When to use:**
- Getting "Invalid token" errors
- Can't access specific nodes
- API requests failing
- First-time setup issues
---
### [CSS-IMPROVEMENTS.md](./CSS-IMPROVEMENTS.md)
Details about CSS generation and class name normalization.
**Topics covered:**
- Class name normalization (fixing colon issues)
- Layout improvements
- Typography enhancements
- CSS reset and best practices
- Supported Figma properties
**When to use:**
- Understanding CSS output
- Customizing CSS generation
- Learning about style conversion
- Debugging layout issues
---
### [IMAGE-FEATURE.md](./IMAGE-FEATURE.md)
Complete guide to the screenshot/image capture feature.
**Topics covered:**
- Supported formats (PNG, JPG, SVG, PDF)
- Scale options and recommendations
- Use cases and best practices
- Format comparison
- API endpoints used
**When to use:**
- Capturing screenshots
- Exporting design assets
- Choosing the right format
- Understanding image quality options
---
## Quick Reference
### Getting Started
1. Read main [README.md](../README.md) for setup
2. Follow installation steps
3. Check [TROUBLESHOOTING.md](./TROUBLESHOOTING.md) if issues arise
### Common Tasks
**Generate HTML/CSS:**
- See main README examples
- Run `npx tsx tests/test-tool.ts` to test
**Capture Screenshots:**
- Read [IMAGE-FEATURE.md](./IMAGE-FEATURE.md)
- Run `npx tsx tests/test-image.ts` to test
**Fix Token Issues:**
- Check [TROUBLESHOOTING.md](./TROUBLESHOOTING.md)
- Run `npx tsx tests/test-token.ts` to validate
### Additional Resources
- [MCP Documentation](https://modelcontextprotocol.io)
- [Figma API Docs](https://www.figma.com/developers/api)
- [TypeScript SDK](https://github.com/modelcontextprotocol/typescript-sdk)
## Contributing to Documentation
When adding new features:
1. Update main [README.md](../README.md) with tool overview
2. Create detailed guide in `docs/` if needed
3. Update this index with link and description
4. Add examples to test scripts in `tests/`
## Documentation Standards
- Use clear, descriptive headings
- Include code examples
- Provide troubleshooting tips
- Add emoji for visual scanning 👀
- Keep examples up-to-date
- Link between related docs