---
name: launch-learning-design
description: Use this skill to generate well-branded interfaces and assets for Launch Learning (LL), the educational arm of Launch Industries — course landings, lesson pages, workbook spreads, certificates, email lessons, and class flyers. Contains essential design guidelines, colors, type, fonts, assets, and UI kit components for prototyping or production.
user-invocable: true
---

Read `README.md` first, then open `index.html` in a browser to see every component in context.

If creating visual artifacts (course landing mocks, lesson previews, workbook spreads, certificates), copy assets out and write static HTML files using `colors_and_type.css`. If working on production code, copy the CSS tokens and read the rules in `README.md` to design fluently in the brand.

If the user invokes this skill without other guidance, ask them what they want to build — a course landing? A lesson? A workbook? A certificate? — then act as an expert designer who outputs HTML artifacts or production code.

## Quick reference

- **Tokens:** `colors_and_type.css` — link this and use the CSS variables.
- **Brand DNA:** Indigo (`#4C3CE5`) primary, paper (`#FBF8F1`) default, pink dot (`#FF0054`) signature accent, yellow (`#FECE00`) highlighter, teal (`#00E0E0`) wave. PP Formula across the board. Bookmark tabs + spreads + the pink dot are the load-bearing chrome.
- **Logo:** `assets/logo-color.png` for light surfaces, `assets/logo-light.png` for indigo / dark surfaces, `assets/icon-color.png` for tight spaces.
- **Type:** PP Formula 800 (display), 300 / 500 (body), Narrow 600 caps (eyebrows). No brush script.
- **Accessibility rule:** Never set yellow as type. Use yellow as a highlighter band or as a small filled shape. Indigo text on paper is fine; black on paper is preferred for body.

## Brand position inside Launch family

- **LIDS** (Launch Industries) — yellow-forward, paper textures, brush script. Warm, handmade.
- **LMC** (LaunchMyCannabiz) — gritty cannabis sub-brand. Halftone duotones, caution stripes, Permanent Marker. Poster / street-level.
- **LL** (Launch Learning) — indigo-forward, page-like, structured. Modern textbook. **Don't borrow LIDS textures or LMC stripes / halftones into LL.**

## Open questions / caveats

- Only the logo and icon are fixed. Everything else in this kit is an opinionated first interpretation of the brand — verify with Monica before locking in for production materials.
- Lucide is the UI icon stand-in. Replace if LL ships its own icon set.
- The `ui_kits/` folder is a starter — extend it with each real LL deliverable so the system gets richer over time.
- Course imagery in the Drive folder (Class Thumbnails, Square Hero Images, Teachable Course Graphics, etc.) is not mirrored into this repo. When designing a specific course's surfaces, pull the relevant Drive assets in and add them to `assets/samples/`.