Architecture as a code

Visualize, collaborate, and evolve the software architecture with always actual and live diagrams from your code

docs | playground | demo

What is LikeC4? Why "like"?

LikeC4 is a modeling language for describing software architecture and tools to generate diagrams from the model.

LikeC4 is inspired by C4 Model and Structurizr DSL, but provides some flexibility. You customize or define your own notation, element types, and any number of nested levels in architecture model.
Perfectly tailored to your needs.

What does LikeC4 look like?

LikeC4 source:

Run CLI to preview:

npx likec4 start

And result:

Template repository - likec4/template
Deployed - https://template.likec4.dev

StackBlitz does not support extensions, so no validation, syntax highlighting and etc.
You can try with github.dev and suggested extension.

Check the Tutorial - a bit better overview of LikeC4.

About this repository

Top-level layout

This repository's contents is divided across four primary sections:

• /docs contains the content for our docs site at likec4.dev
• /examples our local development / examples project
• /integration integration tests (not yet implemented)
• /packages contains the source for packages

Packages

• core: model and type definitions
• create-likec4: scaffolding tool
• diagrams: react components rendering diagrams
• generators: LikeC4 -> Other formats
• graph: Operations over architecture model, like compute views
• language-server: parser and language server
• layouts: layout algorithms for views
• likec4: CLI, published to npm as likec4
• tsconfig: typescript configuration
• vscode: vscode extension
• vscode-preview: preview panel in vscode extension

Local development

Development tasks:

• yarn typecheck: TypeScript compilation
• yarn build: Build packages
• yarn test: Test packages
• yarn vitest:ui: Opens Vitest UI

For VSCode:

• Task Run Extension to start a new VSCode instance with the extension loaded.

License

This project is released under the MIT License