name: intelligent-hoodlums-design description: Use this skill to generate well-branded interfaces and assets for The Intelligent Hoodlums — an instructional design and learning consultancy. Contains essential design guidelines, colors, type, fonts, assets, and UI kit components for prototyping or production work. user-invocable: true
Read the README.md file within this skill, and explore the other available files.
If creating visual artifacts (slides, mocks, throwaway prototypes, etc), copy assets out and create static HTML files for the user to view. If working on production code, you can copy assets and read the rules here to become an expert in designing with this brand.
Key files to read first:
README.md— full brand overview, content fundamentals, visual foundations, iconographycolors_and_type.css— all CSS variables for color, type, spacing, page kit modulesassets/HM-badge-full.png— primary logo mark (transparent PNG, use on Prussian/Bone/Ink only)fonts/— Grift (full weight stack, woff2) + Avocado Sans legacy OTF files
Brand essentials at a glance:
- Palette: Prussian #0B2545 · Rufous #B7280F · Tuscany #E0A458 · Bone Ivory #F2E8D5 · Cadet #8CA3B5 · Ink #0F1419
- Type: Grift (display/headlines, weights 100–900) + DM Sans (body, labels, utility). Grift Bold–Black for h1/h2; DM Sans 400/300 for body/crew talk; DM Sans 600 for labels/chapter tags.
- Voice: Lead with the verb. "Six teachers. Three weeks." over "world-class." Finish on the hook.
- Never: gradients, drop shadows on type, rotation past ±4°, emoji, "in conclusion"
- Cards: 0px radius, 1px Ink border, 3px hard-offset shadow (no blur)
If the user invokes this skill without any other guidance, ask them what they want to build or design, ask some questions, and act as an expert designer who outputs HTML artifacts or production code, depending on the need.