القائمة
IdeaForge brand identity - colors, typography, and visual guidelines. Use when styling UI components, creating marketing materials, or ensuring brand consistency.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Create or modify API endpoints in IdeaForge backend. Triggers: new route, controller, service, repository, CRUD operation, Zod validation, API debugging. Pattern: Routes → Controller → Service → Repository.
Make database schema changes in IdeaForge. Triggers: create migration, add table/column, modify column type, add index, use JSONB, use pgvector. File-based migrations with raw SQL, no ORM.
Comprehensive document creation, editing, and analysis with support for tracked changes, comments, formatting preservation, and text extraction. When Claude needs to work with professional documents (.docx files) for (1) Creating new documents, (2) Modifying or editing content, (3) Working with tracked changes, (4) Adding comments, or any other document tasks.
Comprehensive PDF manipulation toolkit for extracting text and tables, creating new PDFs, merging/splitting documents, and handling forms. When Claude needs to fill in a PDF form or programmatically process, generate, or analyze PDF documents at scale.
Presentation creation, editing, and analysis. When Claude needs to work with presentations (.pptx files) for (1) Creating new presentations, (2) Modifying or editing content, (3) Working with layouts, (4) Adding comments or speaker notes, or any other presentation tasks.
Comprehensive spreadsheet work including creation, editing, and analysis of Excel files (.xlsx, .xlsm, .csv, .tsv). When Claude needs to work with spreadsheets for data analysis, financial modeling, or any Excel-related tasks.
| name | brand-guidelines |
| description | IdeaForge brand identity - colors, typography, and visual guidelines. Use when styling UI components, creating marketing materials, or ensuring brand consistency. |
Name: IdeaForge Tagline: AI-Powered Idea Generation Personality: Innovative, Inspiring, Data-Driven, Professional
Target Audience: Startup founders seeking AI-assisted business idea generation and evaluation.
| Name | Hex | RGB | Usage |
|---|---|---|---|
| Mint | #34D399 | rgb(52, 211, 153) | Primary brand color, CTAs, logo |
| Mint Dark | #10B981 | rgb(16, 185, 129) | Hover states, gradients |
| Coral | #FF6B6B | rgb(255, 107, 107) | Text accents, highlights, alerts |
| Name | Hex | RGB | Usage |
|---|---|---|---|
| Dark Base | #0f1419 | rgb(15, 20, 25) | Primary dark background |
| Dark Surface | #1c2128 | rgb(28, 33, 40) | Cards, elevated surfaces |
| Dark Elevated | #262c36 | rgb(38, 44, 54) | Hover states, borders |
| Name | Hex | RGB | Usage |
|---|---|---|---|
| Text Primary | #f0f6fc | rgb(240, 246, 252) | Primary text on dark |
| Text Secondary | #8b949e | rgb(139, 148, 158) | Secondary text, labels |
| Text Muted | #6e7681 | rgb(110, 118, 129) | Disabled, placeholder |
| Name | Hex | Usage |
|---|---|---|
| Success | #34D399 | Positive actions, success states |
| Warning | #FBBF24 | Warnings, caution |
| Error | #EF4444 | Errors, destructive actions |
| Info | #67E8F9 | Information, tips |
| Type | Style |
|---|---|
| Primary | Background: gradient #34D399 → #10B981, Text: #0f1419 |
| Secondary | Background: transparent, Border: rgba(255,255,255,0.3), Text: #f0f6fc |
| Ghost | Background: transparent, Text: #34D399 |
| Danger | Background: #EF4444, Text: #ffffff |
/* Headings */
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
/* Body */
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
/* Code/Data */
font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, monospace;
| Element | Size | Weight | Line Height |
|---|---|---|---|
| H1 | 2.5rem (40px) | 700 | 1.2 |
| H2 | 2rem (32px) | 600 | 1.25 |
| H3 | 1.5rem (24px) | 600 | 1.3 |
| H4 | 1.25rem (20px) | 600 | 1.4 |
| Body | 1rem (16px) | 400 | 1.6 |
| Small | 0.875rem (14px) | 400 | 1.5 |
| Caption | 0.75rem (12px) | 500 | 1.4 |
// Primary Button
className="bg-gradient-to-r from-emerald-400 to-emerald-500 text-gray-900 font-semibold px-6 py-3 rounded-lg hover:from-emerald-300 hover:to-emerald-400 transition-all"
// Secondary Button
className="border border-white/30 text-gray-100 px-6 py-3 rounded-lg hover:bg-white/5 transition-all"
// Card
className="bg-gray-800/50 rounded-xl p-6 border border-gray-700/50"
// Text Accent
className="text-red-400" // For coral accent on text
// Stats/Numbers
className="text-emerald-400 font-bold text-2xl"
// Background
className="bg-gradient-to-br from-gray-900 to-gray-800"
IdeaForge uses dark mode as the primary theme. All components should be designed dark-first.
// Standard background layers
bg-[#0f1419] // Base
bg-[#1c2128] // Surface
bg-[#262c36] // Elevated
// Or using Tailwind
bg-gray-900 // Base
bg-gray-800 // Surface
bg-gray-700 // Elevated
Base unit: 4px
| Token | Value | Usage |
|---|---|---|
| xs | 4px | Tight spacing |
| sm | 8px | Between related elements |
| md | 16px | Default padding |
| lg | 24px | Section padding |
| xl | 32px | Major sections |
| 2xl | 48px | Page sections |
| Token | Value | Usage |
|---|---|---|
| sm | 4px | Buttons, inputs |
| md | 8px | Cards, containers |
| lg | 12px | Modals, large cards |
| xl | 16px | Hero sections |
| full | 9999px | Pills, avatars |
/* Subtle */
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
/* Card */
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
/* Elevated */
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
/* Glow (for primary elements) */
box-shadow: 0 0 20px rgba(52, 211, 153, 0.3);
// High score (80-100)
className="bg-emerald-500/20 text-emerald-400 px-2 py-1 rounded text-sm font-medium"
// Medium score (50-79)
className="bg-yellow-500/20 text-yellow-400 px-2 py-1 rounded text-sm font-medium"
// Low score (0-49)
className="bg-red-500/20 text-red-400 px-2 py-1 rounded text-sm font-medium"
className="bg-gray-900/95 backdrop-blur border-b border-gray-800"
className="bg-gray-800 border border-gray-700 rounded-lg px-4 py-2 text-gray-100 placeholder-gray-500 focus:border-emerald-500 focus:ring-1 focus:ring-emerald-500"
#34D399Avoid: