design-memory
Extract and reproduce design systems from any website using deterministic analysis and LLM interpretation.
File Explorer
Download Latest Version (.zip)- ci.yml
- release-npm.yml
- ARCHITECTURE.md
- CLI.md
- HOW_IT_WORKS.md
- OUTPUT.md
- README.md
- check-loc.js
- browser.ts
- capture.integration.test.ts
- capture.ts
- computedStyles.ts
- crawl.ts
- from-image.ts
- multi-page.ts
- retry.test.ts
- retry.ts
- screenshots.ts
- spa.ts
- breakpoints.ts
- classes.ts
- colors.test.ts
- colors.ts
- components.detect.ts
- elevation.ts
- layout.spec.fix.ts
- layout.spec.prompt.ts
- layout.spec.schema.ts
- layout.spec.ts
- layout.ts
- layout.vision.parse.ts
- layout.vision.prompt.ts
- layout.vision.ts
- layout.visualize.draw.ts
- layout.visualize.extract.ts
- layout.visualize.filter.ts
- layout.visualize.helpers.ts
- layout.visualize.labels.ts
- layout.visualize.render.ts
- layout.visualize.ts
- motion.ts
- radius.ts
- spacing.test.ts
- spacing.ts
- typography.test.ts
- typography.ts
- variables.ts
- crawl-cache.test.ts
- crawl-cache.ts
- cmd.add.ts
- cmd.diff.ts
- cmd.install.ts
- cmd.learn.ts
- cmd.mix.ts
- main.ts
- progress.ts
- load.ts
- lock.read.ts
- lock.write.ts
- interpret.components.ts
- interpret.doctrine.ts
- interpret.tokens.ts
- llm.client.ts
- llm.prompts.ts
- llm.repair.ts
- diff-render.ts
- diff.ts
- merge.ts
- normalize.ts
- schema.components.ts
- schema.doctrine.ts
- schema.tokens.ts
- schema.ts
- types.components.ts
- types.doctrine.ts
- types.tokens.ts
- types.ts
- run.ts
- stage.acquire.ts
- stage.analyze.ts
- stage.interpret.qa.ts
- stage.interpret.ts
- stage.project.ts
- install.detect.ts
- install.tokens.ts
- install.write.ts
- render.ai-integration.ts
- render.components.ts
- render.instructions.ts
- render.layout.spec.ts
- render.layout.ts
- render.motion.ts
- render.principles.ts
- render.qa.ts
- render.reference.ts
- render.style.test.ts
- render.style.ts
- writeFolder.test.ts
- writeFolder.ts
- render.color-palette.ts
- render.component-patterns.ts
- render.design-system.ts
- render.layout-structure.ts
- render.motion-guidelines.ts
- render.typography.ts
- accuracy.test.ts
- culori.d.ts
- hash.ts
- io.ts
- log.ts
- paths.ts
- index.ts
- .cursorrules
- .env.example
- .eslintrc.json
- .gitignore
- .npmignore
- .prettierrc.json
- bun.lock
- design.png
- eslint.config.js
- package-lock.json
- package.json
- README.md
- real.png
- tsconfig.json
- vitest.config.ts
# Installation Guide
1. Get the code
git clone https://github.com/memvid/design-memory
Downloads the entire project code from GitHub to your computer.
cd design-memory
Moves into the project folder you just downloaded.
2. Official Install Script
Easy RecommendedPrerequisites
- Node.js Node.js must be installed to use npm.
npm install -g design-memory
Installs the package published on the npm registry globally β no need to clone the source.
After installing, open a new terminal and run the program's version command (e.g. --version) to confirm it worked.
Pulled directly from this repo's README.
3. Node.js
EasyPrerequisites
npm install -g design-memory
Installs the package published on the npm registry globally β no need to clone the source.
npm install
Downloads and installs the libraries listed in package.json.
npm run build
Builds optimized production files.
npm test
Type this command into your terminal and run it.
npm run check-loc # Verify all files < 60 LOC
Type this command into your terminal and run it.
After running the command, open the address shown in the terminal (usually something like http://localhost:3000) in your browser.
Pulled directly from this repo's README.
// repository documentation
Was this content helpful?
(0 ratings)