justicehub-brand-alignment

JusticeHub brand alignment and design system. Use for page creation, design review, component patterns, accessibility, and copy writing.

Stars 163

Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/justicehub-brand-alignment

SKILL.md

JusticeHub Brand Alignment

Core Philosophy

"Truth needs no filter, accessible by design"

Direct & Uncompromising
Evidence-Based (data-driven, research-backed)
Accessible First (WCAG AAA)
Community-Centered
Revolutionary Infrastructure

Voice Rules

DO	DON'T
"Australia locks up children. Communities have the cure."	"Together we can make a difference"
"24x Indigenous kids locked up vs non-Indigenous"	"Disproportionate representation"
"FIND HELP NOW"	"Learn More"
Blunt honesty, numbers over narratives	Soft language, charity framing

Style Contexts

Context	Background	Key Colors
Homepage/Marketing	White	Black, Red accent
ALMA Intelligence	Dark (#0a0f16)	Green/Orange data
Steward/Community	White	Green-700 accent
Admin/SimCity	Gray-50	Hard shadows

Key Classes

css

.container-justice     /* Max-width container */
.section-padding       /* py-20 */
.headline-truth        /* Hero headlines */
.hero-stat             /* Large mono numbers */

SimCity Shadow

css

shadow-[4px_4px_0px_0px_rgba(0,0,0,1)]
shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] /* hover */

Data Colors

Success/Community: Blue (#1e40af)
Failure/Detention: Orange (#ea580c)

File References

Need	Reference
Color palette	`references/colors.md`
Components	`references/components.md`
Page templates	`references/templates.md`
Accessibility	`references/accessibility.md`
Steward styling	`references/steward-styling.md`