Agent skill

Electron

Provides comprehensive guidance for Electron framework including main process, renderer process, IPC communication, window management, and desktop app development.

Apache-2.0Auto-check passedDevelopment

Install Electron

skills CLI

$ npx skills add 302ai/302-AI-Studio --skill electron -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install 302ai/302-AI-Studio electron --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/302ai/302-AI-Studio.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/electron .claude/skills/electron && rm -rf skills-src

Use ~/.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/

Paste into Claude Code

Install the "electron" agent skill from https://github.com/302ai/302-AI-Studio/tree/master/.agents/skills/electron into .claude/skills/electron/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "electron", 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

$skill-installer install https://github.com/302ai/302-AI-Studio/tree/master/.agents/skills/electron

Type 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.

skills CLI

$ npx skills add 302ai/302-AI-Studio --skill electron -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install 302ai/302-AI-Studio electron --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/302ai/302-AI-Studio.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/electron .agents/skills/electron && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "electron" agent skill from https://github.com/302ai/302-AI-Studio/tree/master/.agents/skills/electron into .agents/skills/electron/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "electron", 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.

skills CLI

$ npx skills add 302ai/302-AI-Studio --skill electron -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install 302ai/302-AI-Studio electron --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/302ai/302-AI-Studio.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/electron .cursor/skills/electron && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "electron" agent skill from https://github.com/302ai/302-AI-Studio/tree/master/.agents/skills/electron into .cursor/skills/electron/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "electron", 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

$ gemini skills install https://github.com/302ai/302-AI-Studio.git --path .agents/skills/electron

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add 302ai/302-AI-Studio --skill electron -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install 302ai/302-AI-Studio electron --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/302ai/302-AI-Studio.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/electron .gemini/skills/electron && rm -rf skills-src

Use ~/.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/

Paste into Gemini CLI

Install the "electron" agent skill from https://github.com/302ai/302-AI-Studio/tree/master/.agents/skills/electron into .gemini/skills/electron/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "electron", 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.

GitHub CLI

$ gh skill install 302ai/302-AI-Studio electron

Installs 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).

skills CLI

$ npx skills add 302ai/302-AI-Studio --skill electron -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/302ai/302-AI-Studio.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/electron .github/skills/electron && rm -rf skills-src

Use ~/.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/

Paste into GitHub Copilot

Install the "electron" agent skill from https://github.com/302ai/302-AI-Studio/tree/master/.agents/skills/electron into .github/skills/electron/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "electron", 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.

skills CLI

$ npx skills add 302ai/302-AI-Studio --skill electron -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install 302ai/302-AI-Studio electron --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/302ai/302-AI-Studio.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/electron .opencode/skills/electron && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "electron" agent skill from https://github.com/302ai/302-AI-Studio/tree/master/.agents/skills/electron into .opencode/skills/electron/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "electron", 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: electron
GitHub stars: 132
Token cost: ~1.8k tokens
SKILL.md length: 667 words
Files: 13
Skills in repo: 5
Repo updated: Aug 31, 2026
First seen: Oct 7, 2026
Licence: Apache-2.0

At a glance

Provides comprehensive guidance for Electron framework including main process, renderer process, IPC communication, window management, and desktop app development.

Works in 5 steps: Identify the topic from the user's request → Load the appropriate example file from… → Follow the specific instructions in that… → …
The user asks about Electron
SKILL.md covers When to use this skill, How to use this skill, Examples and Templates and API Reference, plus 3 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Electron is an agent skill from 302ai/302-AI-Studio. Provides comprehensive guidance for Electron framework including main process, renderer process, IPC communication, window management, and desktop app development. Use when the user asks about Electron, needs to create desktop applications, implement Electron features, or build cross-platform desktop apps.

Its SKILL.md is about 1.8k tokens, which your agent loads only when the skill is triggered. The skill folder holds 19 other files (for example `api/app.md`, `api/browser-window.md` and `examples/advanced/packaging.md`).

It sits in Development. The licence is Apache-2.0.

When your agent uses it

The user asks about Electron
Needs to create desktop applications
Implement Electron features
Build cross-platform desktop apps

Example prompts

“Use the electron skill to provide comprehensive guidance for Electron framework including main process, renderer process, IPC communication, window…”
“/electron”

Workflow steps

5 steps, taken from the first numbered list in SKILL.md.

Identify the topic from the user's request
Load the appropriate example file from the examples/ directory
Follow the specific instructions in that example file for syntax, structure, and best practices
Reference API documentation in the api/ directory when needed
Use templates from the templates/ directory

What it can do on your machine

Read from SKILL.md and the folder at commit 8b11163. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
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):
- electronjs.org
- electronforge.io
- github.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.

Context cost

Electron loads about 1.8k tokens when it runs. Until then it costs about 79 tokens; SKILL.md has 667 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~79
When it runs · the whole SKILL.md, loaded when a task matches: ~1.8k

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 302ai/302-AI-Studio at commit 8b11163, republished under its Apache-2.0 licence (© 302ai). 667 words, ~1,799 tokens.

Download SKILL.mdSave it as .claude/skills/electron/SKILL.md (or your agent's skills folder). This skill also uses 12 other files; get the full folder from GitHub.

name: electron
description: Provides comprehensive guidance for Electron framework including main process, renderer process, IPC communication, window management, and desktop app development. Use when the user asks about Electron, needs to create desktop applications, implement Electron features, or build cross-platform desktop apps.
license: Complete terms in LICENSE.txt

When to use this skill

Use this skill whenever the user wants to:

Build cross-platform desktop applications with Electron
Understand Electron architecture (main process, renderer process, preload)
Implement IPC (Inter-Process Communication) between processes
Create and manage BrowserWindow instances
Implement menus, tray icons, and native features
Package and distribute Electron applications
Use Electron Forge for project scaffolding and building
Debug and test Electron applications
Implement security best practices
Use Electron APIs (app, BrowserWindow, ipcMain, ipcRenderer, etc.)

How to use this skill

This skill is organized to match the Electron official documentation structure (https://www.electronjs.org/zh/docs/latest/, https://www.electronjs.org/zh/docs/latest/api/app). When working with Electron:

Identify the topic from the user's request:
- Getting started/快速开始 → examples/getting-started/installation.md or examples/getting-started/quick-start.md
- Main process/主进程 → examples/processes/main-process.md
- Renderer process/渲染进程 → examples/processes/renderer-process.md
- IPC communication/IPC 通信 → examples/processes/ipc-communication.md
- BrowserWindow/窗口 → examples/api/browser-window.md
- Menu/菜单 → examples/api/menu.md
- Packaging/打包 → examples/advanced/packaging.md
- Security/安全 → examples/advanced/security.md
Load the appropriate example file from the examples/ directory:

Getting Started (快速开始) - examples/getting-started/:
- examples/getting-started/installation.md - Installing Electron and basic setup
- examples/getting-started/quick-start.md - Quick start tutorial
Processes (进程) - examples/processes/:
- examples/processes/main-process.md - Main process concepts and usage
- examples/processes/renderer-process.md - Renderer process concepts
- examples/processes/preload-scripts.md - Preload scripts usage
- examples/processes/ipc-communication.md - IPC communication patterns
API Examples (API 示例) - examples/api/:
- examples/api/browser-window.md - BrowserWindow usage
- examples/api/menu.md - Menu and context menu
- examples/api/tray.md - System tray
- examples/api/dialog.md - File dialogs
- examples/api/ipc-main.md - ipcMain usage
- examples/api/ipc-renderer.md - ipcRenderer usage
Advanced (高级) - examples/advanced/:
- examples/advanced/packaging.md - Application packaging
- examples/advanced/security.md - Security best practices
- examples/advanced/auto-updater.md - Auto updater
- examples/advanced/native-modules.md - Native modules
Tools (工具) - examples/tools/:
- examples/tools/electron-forge.md - Electron Forge usage
- examples/tools/electron-fiddle.md - Electron Fiddle usage
Follow the specific instructions in that example file for syntax, structure, and best practices

Important Notes:
- All examples follow Electron latest API
- Examples use both CommonJS (require) and ES modules (import)
- Each example file includes key concepts, code examples, and key points
- Always check the example file for best practices and common patterns
- Electron supports Windows, macOS, and Linux
Reference API documentation in the api/ directory when needed:
- api/app.md - app module API
- api/browser-window.md - BrowserWindow API
- api/ipc-main.md - ipcMain API
- api/ipc-renderer.md - ipcRenderer API
- api/menu.md - Menu API
- api/tray.md - Tray API
Use templates from the templates/ directory:
- templates/main-process.md - Main process template
- templates/preload-script.md - Preload script template
- templates/renderer-process.md - Renderer process template
- templates/package-json.md - package.json template

Doc mapping (one-to-one with official documentation)

examples/ → https://www.electronjs.org/zh/docs/latest/
api/ → https://www.electronjs.org/zh/docs/latest/api/app

Examples and Templates

This skill includes detailed examples organized to match the official documentation structure. All examples are in the examples/ directory (see mapping above).

To use examples:

Identify the topic from the user's request
Load the appropriate example file from the mapping above
Follow the instructions, syntax, and best practices in that file
Adapt the code examples to your specific use case

To use templates:

Reference templates in templates/ directory for common scaffolding
Adapt templates to your specific needs and coding style

Show full SKILL.md (238 more words)Show less

API Reference

Detailed API documentation is available in the api/ directory, organized to match the official Electron API documentation structure:

Core APIs (`api/`)

api/app.md - app module API
api/browser-window.md - BrowserWindow API
api/ipc-main.md - ipcMain API
api/ipc-renderer.md - ipcRenderer API
api/menu.md - Menu API
api/tray.md - Tray API
api/dialog.md - Dialog API

To use API reference:

Identify the API you need help with
Load the corresponding API file from the api/ directory
Find the API signature, parameters, return type, and examples
Reference the linked example files for detailed usage patterns
All API files include links to relevant example files in the examples/ directory

Best Practices

Security: Never enable nodeIntegration in renderer process, use preload scripts
Process separation: Keep main and renderer processes separate
IPC communication: Use IPC for safe communication between processes
Resource management: Properly clean up resources (windows, listeners)
Error handling: Implement proper error handling and crash reporting
Performance: Optimize for performance, use webContents for debugging
Packaging: Use Electron Forge or electron-builder for packaging
Auto updates: Implement auto-updater for production apps
Native modules: Handle native module compatibility
Cross-platform: Test on all target platforms

Resources

Official Website: https://www.electronjs.org/zh/
Documentation: https://www.electronjs.org/zh/docs/latest/
API Reference: https://www.electronjs.org/zh/docs/latest/api/app
Electron Forge: https://www.electronforge.io
Electron Fiddle: https://www.electronjs.org/zh/fiddle
GitHub Repository: https://github.com/electron/electron

Keywords

Electron, desktop app, main process, renderer process, preload, IPC, BrowserWindow, Menu, Tray, Dialog, packaging, electron-builder, electron-forge, electron-fiddle, cross-platform, 桌面应用, 主进程, 渲染进程, IPC 通信, 窗口, 菜单, 托盘, 打包

Files

SKILL.md and 12 other files in .agents/skills/electron of 302ai/302-AI-Studio.

SKILL.md
LICENSE.txt
api/app.md
api/browser-window.md
examples/advanced/packaging.md
examples/api/browser-window.md
examples/api/menu.md
examples/getting-started/installation.md
examples/getting-started/quick-start.md
examples/processes/ipc-communication.md
examples/processes/main-process.md
templates/main-process.md
templates/preload-script.md

Open the folder on GitHubat commit 8b11163

Compare with similar skills

Electron 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.

Electron compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Electron this skill302ai/302-AI-Studio	132	—	~1.8k	Automated safety check: Pass	Apache-2.0	1 mo ago
Vercel Composition Patternssupabase/supabase	111k	59 repos	~726	Automated safety check: Pass	MIT	today
Finishing a Development Branchobra/superpowers	296k	5 repos	~1.9k	Automated safety check: Pass	MIT	today
Typescript Advanced Typesrolling-scopes/rsschool-app	10k	25 repos	~4.2k	Automated safety check: Pass	MPL-2.0	4 days ago
PR Babysitteropeninterpreter/openinterpreter	69k	3 repos	~4.2k	Automated safety check: Pass	Apache-2.0	yesterday
Code Review ChecklistshareAI-lab/learn-claude-code	78k	5 repos	~1.1k	Automated safety check: Pass	MIT	10 days ago

Similar skills

Vercel Composition Patterns
supabase/supabase
Official
React composition patterns that scale. An agent skill from supabase/supabase.
111k GitHub starsUsed in 59 repos~726 tokens
DevelopmentAuto-check passed
Finishing a Development Branch
obra/superpowers
Walks the last step of a branch: confirm tests pass, detect the git environment, ask how to integrate, carry out your choice and clean up the worktree.
296k GitHub starsUsed in 5 repos~1.9k tokens
DevelopmentAuto-check passed
Typescript Advanced Types
rolling-scopes/rsschool-app
Master TypeScript's advanced type system including generics, conditional types, mapped types, template literals, and utility types for building type-safe applications.
10k GitHub starsUsed in 25 repos~4.2k tokens
DevelopmentAuto-check passed
PR Babysitter
openinterpreter/openinterpreter
Watches an open GitHub pull request until it merges, handling review comments, diagnosing CI failures and retrying flaky checks along the way.
69k GitHub starsUsed in 3 repos~4.2k tokens
DevelopmentAuto-check passed
Code Review Checklist
shareAI-lab/learn-claude-code
Reviews code against a five-part checklist covering security, correctness, performance, maintainability and testing, and reports findings in a fixed format.
78k GitHub starsUsed in 5 repos~1.1k tokens
DevelopmentAuto-check passed
Greploop
onyx-dot-app/onyx
Iteratively improves a PR (GitHub), MR (GitLab), or shelved changelist (Perforce) until Greptile gives it a 5/5 confidence score with zero unresolved comments.
32k GitHub starsUsed in 4 repos~3.3k tokens
DevelopmentAuto-check passed

Questions about Electron

What does Electron do?

Provides comprehensive guidance for Electron framework including main process, renderer process, IPC communication, window management, and desktop app development. Electron is an agent skill from 302ai/302-AI-Studio. Provides comprehensive guidance for Electron framework including main process, renderer process, IPC communication, window management, and desktop app development.

When should I use Electron?

Electron fits situations like: the user asks about Electron; needs to create desktop applications; implement Electron features; build cross-platform desktop apps.

How do I install Electron in Claude Code?

Run `npx skills add 302ai/302-AI-Studio --skill electron -a claude-code`. Or copy the skill folder (.agents/skills/electron in 302ai/302-AI-Studio) into .claude/skills/electron in your project. Claude Code loads it when a task matches its description.

How do I install Electron in Codex?

Run `npx skills add 302ai/302-AI-Studio --skill electron -a codex`. Or copy the skill folder (.agents/skills/electron in 302ai/302-AI-Studio) into .agents/skills/electron in your project. Codex loads it when a task matches its description.

Can I use Electron 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 302ai/302-AI-Studio --skill electron -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/electron, .gemini/skills/electron, .github/skills/electron and .opencode/skills/electron in your project.

What does Electron need to run?

SKILL.md names no scripts, command-line tools or credentials: Electron is instructions for the agent only.

Does Electron access the network?

SKILL.md names 3 domains. As links in the text: electronjs.org, electronforge.io and github.com. This is read from the text; nothing was executed.

Is Electron 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 Electron use?

Electron is published under the Apache-2.0 licence (from the LICENSE file in the skill folder). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Electron use?

About 1.8k tokens (SKILL.md is roughly 7.2k 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 Electron?

Skills that share tags, products or a category with Electron: Vercel Composition Patterns (supabase/supabase, 111k stars), Finishing a Development Branch (obra/superpowers, 296k stars), Typescript Advanced Types (rolling-scopes/rsschool-app, 10k stars) and PR Babysitter (openinterpreter/openinterpreter, 69k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Electron?

302ai (a GitHub organization) maintains it in 302ai/302-AI-Studio, which has 132 GitHub stars. The repository holds 5 skills in this directory. The repository was last updated on August 31, 2026.

Source: 302ai/302-AI-Studio on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Electron

Install Electron

Facts

At a glance

What it does

When your agent uses it

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

When to use this skill

How to use this skill

Doc mapping (one-to-one with official documentation)

Examples and Templates

API Reference

Core APIs (`api/`)

Best Practices

Resources

Keywords

Files

Compare with similar skills

Similar skills

Vercel Composition Patterns

Finishing a Development Branch

Typescript Advanced Types

PR Babysitter

Code Review Checklist

Greploop

More from 302ai/302-AI-Studio

Adversarial Reviewer

Sveltekit Svelte5 Tailwind Skill

Commit And PR

Create GitHub Pull Request From Specification

Questions about Electron

Install Electron

Facts

At a glance

What it does

When your agent uses it

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

When to use this skill

How to use this skill

Doc mapping (one-to-one with official documentation)

Examples and Templates

API Reference

Core APIs (api/)

Best Practices

Resources

Keywords

Files

Compare with similar skills

Similar skills

More from 302ai/302-AI-Studio

Related

Questions about Electron

Core APIs (`api/`)