You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: AGENTS.md
+10-10Lines changed: 10 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -73,15 +73,15 @@ Never save screenshots, images, or other binary artifacts to the repository root
73
73
74
74
Agent skills in `.agents/skills/` provide detailed guidance for architectural rules and design patterns. Read the relevant skill before making changes.
75
75
76
-
| Skill | When to use |
77
-
| --- | --- |
78
-
|`delegate-to-agent`| Delegating AI work from UI or scripts to the agent |
79
-
|`files-as-database`| Storing or reading app state |
80
-
|`scripts`| Creating or running agent scripts |
81
-
|`sse-file-watcher`| Wiring up real-time UI sync |
82
-
|`self-modifying-code`| Editing app source, components, or styles |
83
-
|`create-skill`| Adding new skills for the agent |
84
-
|`capture-learnings`| Recording corrections and patterns |
85
-
|`frontend-design`| Building or styling any web UI, components, or pages |
|`delegate-to-agent`| Delegating AI work from UI or scripts to the agent|
79
+
|`files-as-database`| Storing or reading app state|
80
+
|`scripts`| Creating or running agent scripts|
81
+
|`sse-file-watcher`| Wiring up real-time UI sync|
82
+
|`self-modifying-code`| Editing app source, components, or styles |
83
+
|`create-skill`| Adding new skills for the agent|
84
+
|`capture-learnings`| Recording corrections and patterns|
85
+
|`frontend-design`| Building or styling any web UI, components, or pages |
86
86
87
87
The **`frontend-design`** skill (sourced from [Anthropic's skills library](https://github.com/anthropics/skills/blob/main/skills/frontend-design/SKILL.md)) applies whenever the agent generates or modifies UI. It enforces distinctive, production-grade aesthetics — avoiding generic AI-generated design patterns like purple gradients, overused fonts, and cookie-cutter layouts.
Copy file name to clipboardExpand all lines: README.md
+11-10Lines changed: 11 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -133,22 +133,23 @@ Your app code is identical regardless of harness. Start local, go to cloud when
133
133
134
134
Agent-native ships with built-in **skills** — structured guidance files in `.agents/skills/` that teach the AI agent how to work within the framework. Every new app created with `npx @agent-native/core create` includes them automatically.
135
135
136
-
| Skill | Purpose |
137
-
| --- | --- |
138
-
|`files-as-database`| Store and read all state as files |
139
-
|`delegate-to-agent`| Route AI work through the agent chat |
140
-
|`scripts`| Create and run agent-callable scripts |
141
-
|`sse-file-watcher`| Keep the UI in sync via SSE |
142
-
|`self-modifying-code`| Safely edit app source and components |
143
-
|`create-skill`| Add new skills to the agent |
144
-
|`capture-learnings`| Record corrections and patterns |
The **`frontend-design`** skill (sourced from [Anthropic's skills library](https://github.com/anthropics/skills/blob/main/skills/frontend-design/SKILL.md)) is active across all templates and new apps. It guides the agent to produce visually striking, memorable interfaces — committing to a clear aesthetic direction rather than defaulting to generic AI-generated patterns.
150
150
151
151
Key principles it enforces:
152
+
152
153
-**Typography**: Distinctive, characterful font pairings — never Arial, Inter, or system defaults
153
154
-**Color**: Cohesive palettes with dominant colors and sharp accents
154
155
-**Motion**: High-impact animations and micro-interactions via CSS or Framer Motion
|`files-as-database`| Before storing or reading any app state|
44
+
|`delegate-to-agent`| Before adding LLM calls or AI delegation|
45
+
|`scripts`| Before creating or modifying scripts|
46
+
|`sse-file-watcher`| Before wiring up real-time UI sync|
47
+
|`self-modifying-code`| Before editing source, components, or styles |
48
+
|`frontend-design`| Before building or restyling any UI component, page, or layout |
49
49
50
50
The **`frontend-design`** skill (sourced from [Anthropic's skills library](https://github.com/anthropics/skills/blob/main/skills/frontend-design/SKILL.md)) enforces distinctive, production-grade aesthetics — committing to a clear visual direction and avoiding generic patterns like purple gradients, overused fonts, and cookie-cutter layouts.
0 commit comments