Web UI Quick Start

Get started with CCCC using the Web interface.

Step 1: Start CCCC

Open a terminal and run:

cccc

This starts both the daemon and the Web UI.

Step 2: Open the Web UI

Open your browser and navigate to:

http://127.0.0.1:8848/

You should see the CCCC Web interface.

Step 3: Create a Working Group

1. Click the + button in the sidebar
2. Or attach an existing project:

# In another terminal
cd /path/to/your/project
cccc attach .

3. Refresh the Web UI to see your new group

Step 4: Add Your First Agent

1. Click Add Actor in the header
2. Fill in the form:
   • Actor ID: e.g., assistant
   • Runtime: Select your installed CLI (e.g., Claude)
3. Click Create

Step 5: Prepare the Runtime Integration

If this is your first time using CCCC with this runtime:

cccc setup --runtime claude   # or codex, droid, etc.

This prepares or reports how the runtime communicates with CCCC. Direct managed Claude Code, Codex, Grok Build, and OpenCode sessions receive their scoped MCP entry automatically when CCCC starts them.

Step 6: Start the Agent

1. Find your agent in the tabs
2. Click the Play button to start it
3. Wait for the agent to initialize

The agent's terminal output appears in the tab.

Step 7: Send Your First Message

1. Click the Chat tab
2. Type a message in the input box:

   Hello! Please introduce yourself.

3. Press Ctrl+Enter / Cmd+Enter, or click Send

Step 8: Watch the Agent Work

1. Switch to the agent's tab to see terminal output
2. Watch as the agent processes your request
3. Responses appear in the Chat tab

Adding More Agents

To add a second agent for collaboration:

1. Click Add Actor again
2. Use a different ID (e.g., reviewer)
3. Optionally use a different runtime
4. Start the agent

Now you can:

• Ask the coordinator: send a normal message, or select @foreman in the recipient controls
• Send to a specific agent: select assistant or reviewer in the recipient controls
• Broadcast only when needed: select @all in the recipient controls for announcements or urgent shared constraints
• Track delegated work: use task-backed delegation when the task needs an owner, outcome, or evidence trail

Using the Context Panel

Click Context to open the side panel:

• Vision: Set the project goal
• Sketch: Document the approach
• Tasks: Track work items
• Notes: Record learnings

Agents can read and update this shared context.

Web UI Features

Feature	How to Access
Switch groups	Click group in sidebar
Agent terminal	Click agent tab
Send message	Chat tab input
@mention	Type @ for name autocomplete/text references; recipients are controlled separately
Reply to message	Click reply icon
Settings	Gear icon in header
Theme	Click moon/sun icon

Keyboard Shortcuts

Shortcut	Action
Ctrl+Enter / Cmd+Enter	Send message
Enter	New line
@	Open mention menu
Escape	Cancel reply / Close menu
↑ ↓	Navigate mention menu
Tab / Enter	Select mention

Troubleshooting

Web UI not loading?

1. Check daemon is running:

   cccc daemon status

2. Try a different port:

   CCCC_WEB_PORT=9000 cccc

Agent won't start?

1. Check the terminal tab for errors
2. Verify MCP setup:

   cccc setup --runtime <name>

Can't see my project?

Administrators can use Create Group → Browse to select a directory on the machine running the CCCC daemon. Project paths must be absolute (or start with ~). Entering one missing final directory creates that exact directory when its parent already exists; relative paths and missing parent chains are rejected. The same directory can be attached to multiple independent groups; the newest attachment becomes the default group for later path-based lookup without changing the older groups.

Group creation, scope attachment, ledger registration, and active-group selection are one compensated operation. Each committed file is read back against the exact value written before the next step starts. A failure restores the previous visible state or returns an explicit rollback_failed error. This is committed-state detection, not a claim of stronger filesystem durability than the host platform provides. The same single-request contract is used by the native Web and CLI surfaces; omitting path keeps the group-only creation behavior. For a request that includes path, CCCC publishes group.created only after the group, scope, ledger event, and active-group selection have all committed. A failed transaction removes its internal group without publishing a matching create or delete event.

Alternatively, run cccc attach . in your project directory, then refresh the Web UI.

Next Steps

• Workflows - Learn collaboration patterns
• Web UI Guide - Detailed UI documentation
• IM Bridge - Set up mobile access