ds-context

Preamble

"../lib/env.sh" "context"
# NPM design system token detection
_ROOT=$(git rev-parse --show-toplevel 2>/dev/null || echo ".")
_PKG="$_ROOT/package.json"
if [ -f "$_PKG" ]; then
  _HAS_SHADCN="no"; _HAS_TAILWIND="no"; _HAS_BLEND="no"
  [ -f "$_ROOT/components.json" ] && _HAS_SHADCN="yes"
  { [ -f "$_ROOT/tailwind.config.js" ] || [ -f "$_ROOT/tailwind.config.ts" ]; } && _HAS_TAILWIND="yes"
  [ -d "$_ROOT/node_modules/@juspay/blend-design-system" ] && _HAS_BLEND="yes"
  echo "NPM_TOKENS: shadcn=${_HAS_SHADCN} | tailwind=${_HAS_TAILWIND} | blend=${_HAS_BLEND}"
fi
_CLAUDE_MD="$_ROOT/CLAUDE.md"
_HAS_CLAUDE_MD="no"; _HAS_DESIGNSTACK_RULES="no"
[ -f "$_CLAUDE_MD" ] && _HAS_CLAUDE_MD="yes"
[ -f "$_CLAUDE_MD" ] && grep -q "ds:design-rules:start" "$_CLAUDE_MD" 2>/dev/null && _HAS_DESIGNSTACK_RULES="yes"
echo "CLAUDE_MD: $_HAS_CLAUDE_MD | has_rules: $_HAS_DESIGNSTACK_RULES"

Guard: not a git repo

If GIT_ROOT is . (meaning git could not find a project root), stop immediately and say:

"I don't see a project here. Make sure you open Claude Code from your project folder — the one that has your src/ or package.json. Then run /ds-context again."

Do not continue past this point if GIT_ROOT is ..

---

Opening line (always show this, never the raw preamble output)

"Looking at your project..."

What this skill does

You're building the Design Bible — a living file at design/DESIGN-BIBLE.md that holds everything about how this project looks and feels. Every other designStack skill reads from it. Once it exists, you never have to explain your brand again.

This takes about 5 minutes.

Step 0 — Auto-scan code files

Before asking the user anything, read these files silently (do not show the raw contents to the user):

1. CSS custom properties — look for the first file that exists:
   • src/app/globals.css
   • app/globals.css
   • src/index.css
   • src/styles/globals.css Read it and extract every --variable: value pair from the :root block. Note colors, fonts, spacing tokens.