# Frameium

> Capture, organize, and build from the best design on the web — for humans and agents.

Frameium captures the best design on the web and frames it for reuse: snap any URL and its sections are auto-categorized by element, device, and type into a searchable library. Curate moodboards, save smart views, and turn references into layouts — so humans and agents can find and build from exactly the right frame, fast.

## The Two Pillars

### 1. Tools
A curated, auto-categorized directory of design software, utilities, and creative apps. Each tool entry includes:
- Name, tagline, full description, and canonical URL
- Export types (what the tool outputs: image, video, code, svg, etc.)
- Categories and subcategories from a fixed taxonomy
- Platforms (web, macOS, Figma plugin, API, CLI, etc.)
- Pricing model
- Color palette extracted from logo and screenshots
- An agent-readable capability descriptor with inputs, outputs, best-use cases, keywords, and API availability

### 2. Inspiration
A growing library of visual reference, auto-tagged and searchable by:
- Medium (photo, 3d-render, illustration, ui, poster, typography, packaging, etc.)
- Style descriptors (swiss, brutalist, minimal, editorial, y2k, bauhaus, etc.)
- Surface textures (grain, gradient, metallic, chrome, risograph, etc.)
- Aspect ratio
- Color palette and color buckets

## Color Vocabulary (shared across both pillars)

Color filter uses coarse named buckets — pass these ids to the colors param:
  - red: Red
  - orange: Orange
  - amber: Amber
  - yellow: Yellow
  - lime: Lime
  - green: Green
  - teal: Teal
  - cyan: Cyan
  - blue: Blue
  - indigo: Indigo
  - violet: Violet
  - purple: Purple
  - magenta: Magenta
  - pink: Pink
  - brown: Brown
  - beige: Beige
  - gray: Gray
  - black: Black
  - white: White
  - multicolor: Multicolor
  - monochrome: Monochrome

## Tool Categories

  - image-generator: Image Generator — AI and procedural tools that generate still imagery.
  - video-generator: Video Generator — Tools that generate or synthesize video.
  - animation: Animation — Motion, keyframe, and procedural animation tools.
  - image-effects: Image Effects — Filters, effects, and stylization applied to images.
  - design-editor: Design Editor — Canvases and editors for composing designs.
  - 3d: 3D — 3D modeling, rendering, and scene tools.
  - design-to-code: Design → Code — Turn designs, prompts, or screenshots into UI code.
  - vector-illustration: Vector & Illustration — Vector drawing, illustration, and SVG tooling.
  - typography: Typography — Type design, font tools, and lettering.
  - color: Color — Palette generation, extraction, and color systems.
  - mockup: Mockup — Device, product, and scene mockups.
  - prototyping: Prototyping — Interactive prototypes and flows.
  - asset-library: Asset Library — Icons, stock, textures, and reusable assets.
  - branding: Branding — Logo, identity, and brand-system tools.
  - motion-graphics: Motion Graphics — Title cards, lower-thirds, and motion systems.
  - texture-pattern: Texture & Pattern — Generative textures, patterns, and backgrounds.
  - ai-studio: AI Studio — Multimodal AI creative studios and agents.
  - inspiration: Inspiration — Reference, moodboarding, and discovery tools.

## Export Types (what tools output / what to filter by)

  - image: Image
  - video: Video
  - animation: Animation
  - svg: SVG
  - vector: Vector
  - 3d: 3D
  - code: Code
  - website: Website
  - motion: Motion
  - gif: GIF
  - font: Font
  - audio: Audio
  - prototype: Prototype
  - design-file: Design File

## Platforms

  - web: Web
  - macos: macOS
  - windows: Windows
  - ios: iOS
  - android: Android
  - figma-plugin: Figma Plugin
  - chrome-extension: Chrome Extension
  - vscode-extension: VS Code
  - api: API
  - cli: CLI
  - desktop: Desktop

## Pricing Models

  - free: Free
  - freemium: Freemium
  - paid: Paid
  - subscription: Subscription
  - open-source: Open Source
  - waitlist: Waitlist

## API Endpoints

All endpoints return JSON. Base: https://frameium.com/api/v1

### Discovery
GET https://frameium.com/api/v1
Returns this manifest as structured JSON including full vocabulary and example queries.

### Tools
GET https://frameium.com/api/v1/tools
Params: q, categories, subcategories, exportTypes, platforms, pricing, colors, featured, sort, limit, offset
Example: https://frameium.com/api/v1/tools?exportTypes=svg,vector&pricing=free,freemium&sort=trending

GET https://frameium.com/api/v1/tools/:slug
Single tool by slug.

### Inspiration
GET https://frameium.com/api/v1/inspiration
Params: q, medium, style, textures, ratio, colors, sort, limit, offset
Example: https://frameium.com/api/v1/inspiration?style=swiss,minimal&colors=orange,black

GET https://frameium.com/api/v1/inspiration/:id
Single inspiration item by id.

### Cross-Pillar Search
GET https://frameium.com/api/v1/search?q=grain+texture
Returns top results from tools and inspiration in one call. Param: q (required), limit (per pillar, default 10).

### Colors
GET https://frameium.com/api/v1/colors
Color bucket counts for all three catalog kinds.

## MCP Server (agent access to a user's own library)

https://frameium.com/api/mcp — Streamable HTTP MCP server. Auth: Authorization: Bearer frm_...
(per-user API key from https://frameium.com/settings/api-keys). Tools: save_links,
import_bookmarks_html, list_library, search_library (semantic search over the
user's own library), list_boards, get_board, capture_url, delete_items.
All scoped to the key's user. Rate limit ~120 req/hour/user. How-to page:
https://frameium.com/mcp.

## Filtering Notes

- All array params accept comma-separated values: ?colors=orange,black,red
- sort options: trending (default) | newest | most-saved | alphabetical (tools only)
- Default limit: 50. Max: 200.
- Only published items are returned.
- Each Tool includes an "agent" field with: summary, inputs, outputs, bestFor, keywords, hasApi

## Site Pages

https://frameium.com/ — Home
https://frameium.com/tools — Browse tools
https://frameium.com/inspiration — Browse inspiration
https://frameium.com/about — About Frameium
https://frameium.com/mcp — MCP server how-to