KubeSphere Multi-Tenant Management
kubesphere/kubesphere
Creates and queries KubeSphere users, workspaces and projects and assigns built-in roles, defaulting to least privilege and never deleting anything.
Agent skill
Framer Reference Architecture
by jeremylongshore in jeremylongshore/tons-of-skills-marketplace
Implement Framer reference architecture with best-practice project layout.
Install Framer Reference Architecture
$ npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install jeremylongshore/tons-of-skills-marketplace framer-reference-architecture --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/jeremylongshore/tons-of-skills-marketplace.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/.curated/framer-reference-architecture .claude/skills/framer-reference-architecture && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "framer-reference-architecture" agent skill from https://github.com/jeremylongshore/tons-of-skills-marketplace/tree/main/skills/.curated/framer-reference-architecture into .claude/skills/framer-reference-architecture/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "framer-reference-architecture", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/jeremylongshore/tons-of-skills-marketplace/tree/main/skills/.curated/framer-reference-architectureType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install jeremylongshore/tons-of-skills-marketplace framer-reference-architecture --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jeremylongshore/tons-of-skills-marketplace.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/.curated/framer-reference-architecture .agents/skills/framer-reference-architecture && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "framer-reference-architecture" agent skill from https://github.com/jeremylongshore/tons-of-skills-marketplace/tree/main/skills/.curated/framer-reference-architecture into .agents/skills/framer-reference-architecture/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "framer-reference-architecture", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install jeremylongshore/tons-of-skills-marketplace framer-reference-architecture --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jeremylongshore/tons-of-skills-marketplace.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/.curated/framer-reference-architecture .cursor/skills/framer-reference-architecture && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "framer-reference-architecture" agent skill from https://github.com/jeremylongshore/tons-of-skills-marketplace/tree/main/skills/.curated/framer-reference-architecture into .cursor/skills/framer-reference-architecture/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "framer-reference-architecture", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/jeremylongshore/tons-of-skills-marketplace.git --path skills/.curated/framer-reference-architecture--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install jeremylongshore/tons-of-skills-marketplace framer-reference-architecture --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jeremylongshore/tons-of-skills-marketplace.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/.curated/framer-reference-architecture .gemini/skills/framer-reference-architecture && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "framer-reference-architecture" agent skill from https://github.com/jeremylongshore/tons-of-skills-marketplace/tree/main/skills/.curated/framer-reference-architecture into .gemini/skills/framer-reference-architecture/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "framer-reference-architecture", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install jeremylongshore/tons-of-skills-marketplace framer-reference-architectureInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/jeremylongshore/tons-of-skills-marketplace.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/.curated/framer-reference-architecture .github/skills/framer-reference-architecture && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "framer-reference-architecture" agent skill from https://github.com/jeremylongshore/tons-of-skills-marketplace/tree/main/skills/.curated/framer-reference-architecture into .github/skills/framer-reference-architecture/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "framer-reference-architecture", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install jeremylongshore/tons-of-skills-marketplace framer-reference-architecture --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/jeremylongshore/tons-of-skills-marketplace.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/.curated/framer-reference-architecture .opencode/skills/framer-reference-architecture && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "framer-reference-architecture" agent skill from https://github.com/jeremylongshore/tons-of-skills-marketplace/tree/main/skills/.curated/framer-reference-architecture into .opencode/skills/framer-reference-architecture/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "framer-reference-architecture", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
framer-reference-architecture- GitHub stars
- 2.8k
- Token cost
- ~1.2k tokens
- SKILL.md length
- 229 words
- Files
- 1
- Skills in repo
- 3,342
- Repo updated
- First seen
- Licence
- MIT
At a glance
Implement Framer reference architecture with best-practice project layout.
- Designing new Framer integrations
- SKILL.md covers Prerequisites, Instructions, Output and Error Handling, plus 8 more sections
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
- Reviewing project structure
What it does
Framer Reference Architecture is an agent skill from jeremylongshore/tons-of-skills-marketplace. Implement Framer reference architecture with best-practice project layout. Use when designing new Framer integrations, reviewing project structure, or establishing architecture standards for Framer applications. Trigger with phrases like "framer architecture", "framer best practices", "framer project structure", "how to organize framer", "framer layout".
Its SKILL.md is about 1.2k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts. Compatibility notes: Designed for Claude Code
It sits in DevOps & Cloud. The repository describes itself as: Model-agnostic agent-skills platform with a harness-free canonical layer, verified adapters, and the ccpi package manager. Explore at tonsofskills.com. The licence is MIT.
When your agent uses it
- Designing new Framer integrations
- Reviewing project structure
- Establishing architecture standards for Framer applications
- With phrases like framer architecture
Example prompts
- “framer architecture”
- “framer best practices”
- “framer project structure”
- “/framer-reference-architecture”
Requirements
- Node.js
- Compatibility (from SKILL.md): Designed for Claude Code
- Pre-approved tools (allowed-tools): Read, Grep
What it can do on your machine
Read from SKILL.md and the folder at commit cfae287. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves these tools, so the agent can use them without asking each time:
ReadGrep
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
Links to these hosts (documentation or services it may open):
framer.com
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Compatibility
Designed for Claude Code
From compatibility in the SKILL.md frontmatter.
Context cost
Framer Reference Architecture loads about 1.2k tokens when it runs. Until then it costs about 97 tokens; SKILL.md has 229 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from jeremylongshore/tons-of-skills-marketplace at commit cfae287, republished under its MIT licence (© jeremylongshore). 229 words, ~1,189 tokens.
Download SKILL.mdSave it as
.claude/skills/framer-reference-architecture/SKILL.md (or your agent's skills folder).- name
- framer-reference-architecture
- description
- Implement Framer reference architecture with best-practice project layout. Use when designing new Framer integrations, reviewing project structure, or establishing architecture standards for Framer applications. Trigger with phrases like "framer architecture", "framer best practices", "framer project structure", "how to organize framer", "framer layout".
- allowed-tools
- Read, Grep
- compatibility
- Designed for Claude Code
- version
- 1.5.0
- license
- MIT
- author
- Jeremy Longshore <jeremy@intentsolutions.io>
- tags
- saas, framer
Framer Reference Architecture
Prerequisites
Documented site owners, publishing/domain access policy, approved integrations, visitor-data boundaries, synthetic staging site, and rollback owner.
Instructions
Separate editing, publishing, domain/DNS, forms, analytics, and downstream integrations by least privilege. Validate changes in staging, use redacted telemetry, promote a canary, and retain a tested rollback path.
Output
Maintain an architecture record with trust boundaries, approved destinations, access/retention controls, owners, canary result, and rollback mechanism. Exclude credentials and visitor submissions.
Error Handling
Quarantine unknown integration destinations and stop publishing on domain, access, or privacy-policy failures. Restore the prior configuration before retrying.
Examples
Publish a fictional staging page, deny an unapproved analytics consumer, and verify rollback restores the prior site without leaking form data.
Overview
Production architecture for Framer integrations covering plugins, Server API CMS sync, code components, and automated publishing pipelines.
Architecture Diagram
┌─────────────────────────────────────────────┐
│ Framer Editor │
│ ┌──────────┐ ┌───────────┐ ┌──────────┐ │
│ │ Plugins │ │ Code │ │ Code │ │
│ │ (iframe) │ │ Components│ │ Overrides│ │
│ └────┬─────┘ └───────────┘ └──────────┘ │
│ │ framer-plugin SDK │
├───────┴──────────────────────────────────────┤
│ Framer CMS │
│ ┌──────────────┐ ┌───────────────────┐ │
│ │ Managed │ │ Unmanaged │ │
│ │ Collections │ │ Collections │ │
│ └──────┬───────┘ └───────────────────┘ │
├─────────┴────────────────────────────────────┤
│ Server API (WebSocket) │
│ framer-api package │
└─────────┬────────────────────────────────────┘
│
┌─────────┴────────────────────────────────────┐
│ Your Backend │
│ ┌────────────┐ ┌──────────┐ ┌──────────┐ │
│ │ CMS Sync │ │ Webhook │ │ CI/CD │ │
│ │ Service │ │ Handler │ │ Pipeline │ │
│ └────────────┘ └──────────┘ └──────────┘ │
└──────────────────────────────────────────────┘Project Structure
framer-integration/
├── plugin/ # Framer editor plugin
│ ├── src/
│ │ ├── App.tsx # Plugin UI
│ │ ├── hooks/ # Plugin state hooks
│ │ └── cms/ # CMS sync logic
│ ├── vite.config.ts
│ └── package.json
├── server/ # Server API backend
│ ├── src/
│ │ ├── sync.ts # CMS sync service
│ │ ├── publish.ts # Auto-publish logic
│ │ └── webhooks.ts # External webhook handlers
│ └── package.json
├── components/ # Shared code components
│ ├── AnimatedCounter.tsx
│ ├── DataList.tsx
│ └── index.ts
├── overrides/ # Shared code overrides
│ ├── animations.tsx
│ └── interactions.tsx
└── .env.exampleIntegration Patterns
| Pattern | When | How |
|---|---|---|
| Plugin CMS Sync | User-initiated sync | Plugin UI → managed collection |
| Server API Sync | Automated/scheduled | Node.js → Server API WebSocket |
| CI/CD Publish | On content change | GitHub Actions → Server API → publish |
| Webhook Bridge | External CMS events | Webhook → your API → Server API |
Decision Matrix
| Need | Solution |
|---|---|
| Custom UI in editor | Framer Plugin |
| Headless CMS sync | Server API |
| Custom interactive elements | Code Components |
| Modify existing animations | Code Overrides |
| Automated publishing | Server API + CI/CD |
Resources
Next Steps
Start with framer-install-auth to set up your development environment.
© jeremylongshore, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in skills/.curated/framer-reference-architecture of jeremylongshore/tons-of-skills-marketplace.
Open the folder on GitHubat commit cfae287
Compare with similar skills
Framer Reference Architecture next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Framer Reference Architecture this skilljeremylongshore/tons-of-skills-marketplace | 2.8k | — | ~1.2k | Automated safety check: Pass | MIT | |
| KubeSphere Multi-Tenant Managementkubesphere/kubesphere | 17k | — | ~3.1k | Automated safety check: Pass | Custom licence | |
| Azure PricingAzure/Copilot-Studio-and-Azure | 110 | 2 repos | ~2.4k | Automated safety check: Pass | MIT | |
| NGINX Ingress Policy CRD Guidenginx/kubernetes-ingress | 5.1k | — | ~2k | Automated safety check: Pass | Apache-2.0 | |
| Distributed Tracingwshobson/agents | 40k | 12 repos | ~527 | Automated safety check: Pass | MIT | |
| ArvanCloud API Operatorerfnzdeh/arvancloud-agent-skill | 134 | — | ~3.9k | Automated safety check: Pass | MIT |
Similar skills
- Official
Azure Pricing
Azure/Copilot-Studio-and-Azure
Fetches real-time Azure retail pricing using the Azure Retail Prices API (prices.azure.com) and estimates Copilot Studio agent credit consumption.
NGINX Ingress Policy CRD Guide
nginx/kubernetes-ingress
Step-by-step checklist for adding a new Policy CRD type to the NGINX Ingress Controller, from the Go types and validation to config generation and templates.
Distributed Tracing
wshobson/agents
Implement distributed tracing with Jaeger and Tempo to track requests across microservices and identify performance bottlenecks.
ArvanCloud API Operator
erfnzdeh/arvancloud-agent-skill
Drives ArvanCloud's REST APIs for CDN, DNS, cloud servers, object storage and more, with helper scripts for calls, account inventory and certificates.
- Official
Datadog Data Source Generator
DataDog/terraform-provider-datadog
Generates a Datadog Terraform provider data source from an OpenAPI operation with tfgen and opens a review-ready GitHub PR with a risk scan and testing guide.
More from jeremylongshore/tons-of-skills-marketplace
All 3,342 skills in this repoPerforming Security Code Review
jeremylongshore/tons-of-skills-marketplace
Execute this skill enables AI assistant to conduct a security-focused code review using the security-agent plugin.
Adapting Transfer Learning Models
jeremylongshore/tons-of-skills-marketplace
Build this skill automates the adaptation of pre-trained machine learning models using transfer learning techniques.
Agent Context Loader
jeremylongshore/tons-of-skills-marketplace
Execute proactive auto-loading: automatically detects and loads agents.md files.
Aggregating Performance Metrics
jeremylongshore/tons-of-skills-marketplace
Aggregate and centralize performance metrics from applications, systems, databases, caches, and services.
Analyzing Capacity Planning
jeremylongshore/tons-of-skills-marketplace
Execute this skill enables AI assistant to analyze capacity requirements and plan for future growth.
Analyzing Database Indexes
jeremylongshore/tons-of-skills-marketplace
Process use when you need to work with database indexing. An agent skill from jeremylongshore/tons-of-skills-marketplace.
Related
Categories
Questions about Framer Reference Architecture
What does Framer Reference Architecture do?
Implement Framer reference architecture with best-practice project layout. Framer Reference Architecture is an agent skill from jeremylongshore/tons-of-skills-marketplace. Implement Framer reference architecture with best-practice project layout.
When should I use Framer Reference Architecture?
Framer Reference Architecture fits situations like: designing new Framer integrations; reviewing project structure; establishing architecture standards for Framer applications; with phrases like framer architecture.
How do I install Framer Reference Architecture in Claude Code?
Run `npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a claude-code`. Or copy the skill folder (skills/.curated/framer-reference-architecture in jeremylongshore/tons-of-skills-marketplace) into .claude/skills/framer-reference-architecture in your project. Claude Code loads it when a task matches its description.
How do I install Framer Reference Architecture in Codex?
Run `npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a codex`. Or copy the skill folder (skills/.curated/framer-reference-architecture in jeremylongshore/tons-of-skills-marketplace) into .agents/skills/framer-reference-architecture in your project. Codex loads it when a task matches its description.
Can I use Framer Reference Architecture in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add jeremylongshore/tons-of-skills-marketplace --skill framer-reference-architecture -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/framer-reference-architecture, .gemini/skills/framer-reference-architecture, .github/skills/framer-reference-architecture and .opencode/skills/framer-reference-architecture in your project.
What does Framer Reference Architecture need to run?
SKILL.md names no scripts, command-line tools or credentials: Framer Reference Architecture is instructions for the agent only. Our summary lists: Node.js. Its frontmatter pre-approves these tools: Read, Grep. Compatibility (from SKILL.md): Designed for Claude Code.
Does Framer Reference Architecture access the network?
SKILL.md names 1 domain. As links in the text: framer.com. This is read from the text; nothing was executed.
Is Framer Reference Architecture safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Framer Reference Architecture use?
Framer Reference Architecture is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Framer Reference Architecture use?
About 1.2k tokens (SKILL.md is roughly 4.8k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Framer Reference Architecture?
Skills that share tags, products or a category with Framer Reference Architecture: KubeSphere Multi-Tenant Management (kubesphere/kubesphere, 17k stars), Azure Pricing (Azure/Copilot-Studio-and-Azure, 110 stars), NGINX Ingress Policy CRD Guide (nginx/kubernetes-ingress, 5.1k stars) and Distributed Tracing (wshobson/agents, 40k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Framer Reference Architecture?
jeremylongshore (a GitHub user) maintains it in jeremylongshore/tons-of-skills-marketplace, which has 2,827 GitHub stars. The repository holds 3,342 skills in this directory. The repository was last updated on October 10, 2026.
Source: jeremylongshore/tons-of-skills-marketplace on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.