Files
twenty/packages/twenty-sdk
Raphaël Bosi 293ff4c462 Auto-generate app cover images from the app logo (#22011)
<img width="1388" height="858" alt="image"
src="https://github.com/user-attachments/assets/59f16bf7-5908-4624-b3af-51416bbebba3"
/>


## What

When an app is built (`twenty build` / `twenty publish`), the SDK now
generates a marketplace cover image and sets it as the app's screenshot,
but only when the app declares a `logoUrl` and has no `screenshots`. The
cover composites the app's logo and the Twenty logo over the branded
halftone backdrop, matching the design reference.

## Why

Most apps ship a logo but no screenshots, so their marketplace detail
page had no hero visual. This gives them a polished cover for free, with
no per-app design work.

## Notes for reviewers

- Generation lives in the build path (`operations/build.ts`), not
`buildManifest`, so `twenty dev` and the shared manifest builder are
untouched. It is best-effort: on failure it logs a warning and the build
continues.
- The cover is written to `.twenty/output` and registered as a public
asset + screenshot, so the existing copy/checksum/serve pipeline handles
it unchanged. No app source files are modified.
- Adds `sharp` as a runtime dependency of `twenty-sdk` (a build-time
tool, like `esbuild`); it is not bundled into built apps.

<!-- This is an auto-generated description by cubic. -->
<a
href="https://cubic.dev/pr/twentyhq/twenty/pull/22011?utm_source=github"
target="_blank" rel="noopener noreferrer"
data-no-image-dialog="true"><picture><source
media="(prefers-color-scheme: dark)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source
media="(prefers-color-scheme: light)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img
alt="Review in cubic"
src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a>
<!-- End of auto-generated description by cubic. -->
2026-06-23 13:41:19 +00:00
..
2026-03-09 15:32:13 +00:00

Twenty logo

Twenty SDK

NPM version License Join the community on Discord

A CLI and SDK to develop, build, and publish applications that extend Twenty CRM.

Quick start

The recommended way to start is with create-twenty-app:

npx create-twenty-app@latest my-twenty-app
cd my-twenty-app
yarn twenty dev

Documentation

Full documentation is available at docs.twenty.com/developers/extend/apps:

  • Getting Started — scaffolding, local server, authentication, dev mode
  • Building Apps — entity definitions, API clients, testing, CLI reference
  • Publishing — deploy, npm publish, marketplace

Guides in this repository:

Manual installation

If you are adding twenty-sdk to an existing project instead of using create-twenty-app:

yarn add twenty-sdk twenty-client-sdk

Then add a twenty script to your package.json:

{
  "scripts": {
    "twenty": "twenty"
  }
}

Run yarn twenty help to see all available commands.

Configuration

The CLI stores credentials per remote in ~/.twenty/config.json. Run yarn twenty remote:add to configure a remote, or yarn twenty remote:list to see existing ones.

Troubleshooting

  • Auth errors: run yarn twenty remote:add to re-authenticate.
  • Typings out of date: restart yarn twenty dev to refresh the client and types.
  • Not seeing changes in dev: make sure dev mode is running (yarn twenty dev).

Contributing

Development setup

git clone https://github.com/twentyhq/twenty.git
cd twenty
yarn install

Development mode

npx nx run twenty-sdk:dev

Production build

npx nx run twenty-sdk:build

Running the CLI locally

npx nx run twenty-sdk:start -- <command>

Resources