mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-17 16:46:31 +03:00
Paul BakausandClaude Fable 5
90f9eeb99b
The public repo keeps the OSS promise surface: skill, CLI, extension, tests, and the provider build. The site, labs, concept/composition catalogs, image pipeline, Cloudflare functions, and authoring guide move to pbakaus/impeccable-site. concept-seed tests run against a synthetic fixture catalog; the plugin icon and skill categories moved in-repo; build validation narrows to README prose and non-site counts; release notes read from a sibling impeccable-site checkout. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
1 line
2.6 KiB
JSON
1 line
2.6 KiB
JSON
{"patterns":[{"name":"Typography","items":["Pair a distinctive display face with a restrained body face; vary across projects.","Use a ≥1.25 scale ratio between hierarchy steps. Flat scales read as bland.","Cap body line length at 65–75ch. Wider is fatiguing."]},{"name":"Color & Contrast","items":["Use OKLCH. Reduce chroma near lightness extremes.","Tint neutrals toward the brand hue. Chroma 0.005–0.01 is enough.","Pick a color strategy before picking colors (Restrained, Committed, Full, Drenched)."]},{"name":"Layout & Space","items":["Vary spacing for rhythm. Tight groupings, generous separations.","Use the simplest tool: Flexbox for 1D, Grid for 2D, plain flow often enough.","Let whitespace carry hierarchy before reaching for color or scale."]},{"name":"Visual Details","items":["Commit to an aesthetic direction and execute it with precision.","Use ornament only where it earns its place."]},{"name":"Motion","items":["Use transform and opacity. Animate the composited properties only.","Ease out with exponential curves (quart / quint / expo).","Respect prefers-reduced-motion on every transition."]},{"name":"Interaction","items":["Use optimistic UI: update immediately, sync later.","Design empty states that teach the interface, not just say \"nothing here.\"","Progressive disclosure: start simple, reveal sophistication on demand."]}],"antipatterns":[{"name":"Typography","items":["Inter, Roboto, Plex, Fraunces, or any other reflex default. Look further.","Monospace as lazy shorthand for \"technical.\"","Long passages in uppercase. Reserve all-caps for short labels."]},{"name":"Color & Contrast","items":["Pure #000 or #fff. Always tint.","Dark mode + purple-to-cyan gradients. The AI tell.","Gradient text via background-clip. Use weight or size for emphasis."]},{"name":"Layout & Space","items":["Wrap everything in cards. Nested cards are always wrong.","Identical card grids of icon + heading + text, repeated endlessly.","The hero-metric template: big number, small label, supporting stats, gradient accent."]},{"name":"Visual Details","items":["Side-stripe borders (border-left/-right > 1px). The dashboard tell.","Glassmorphism everywhere. Rare and purposeful or nothing.","Rounded rectangles with generic drop shadows. \"Could be any AI output.\""]},{"name":"Motion","items":["Animate layout (width, height, padding, margin).","Bounce or elastic easing. Feels dated and tacky.","Decorative motion for its own sake. Motion should signal state."]},{"name":"Interaction","items":["Make every button primary. Hierarchy matters.","Default to a modal. Exhaust inline alternatives first.","Repeat information the user can already see."]}]} |