Corcho (/ˈkoɾt͡ʃo/) is a tool that creates and sync web slideshows using the contents of a Figma file. You can then use GitHub Pages to host your slideshow on the web and have it automatically updated using GitHub Actions.
- Create a file in Figma and your slides as frames.
- Create a non-expiring Figma personal access token.
- Copy the file id of your Figma file (which is the string of random alphanumeric characters found in the URL after
figma.com/design/)
- Fork this project and add two secrets:
FIGMA_FILE: with the file id.FIGMA_TOKEN: with your Figma Personal Access Token.
Optionally, add FILE_FORMAT to specify the format of the exported images. The default is jpg, but you can also use png or svg.
- Enable:
- GitHub pages for the
mainbranch. - The deploy workflow (by visiting the Actions tab).
By default the cronjob of the GitHub Action will run every hour on the hour, but you can change the scheduling to be more frequent. Here's an example of a job that gets executed every 5 minutes (which is the shortest interval allowed):
name: Cron
on:
push:
branches: [ "main" ]
schedule:
- cron: "*/5 * * * *" # Runs every 5 minutes
If you don't need continuous updates, you can remove the .github/workflows/deploy.yml file.
Also, please note that free accounts have a limit of 500 MB and 2,000 minutes of run time per month. Please check the included storage and minutes available for your account type.
- Clone this project
- Rename the
.env.samplefile to.envand update it:
FIGMA_FILE: with the file id.FIGMA_TOKEN: with your Figma Personal Access Token.
- Install the dependencies with
yarn installornpm install - Run the project with
yarn startornpm run start - Open the
index.htmlfile in your browser using a local server.
| Key | Action |
|---|---|
| ← or Space + Shift | Previous slide |
| → or Space | Next slide |
| J or Page Down | Next page |
| K or Page Up | Previous page |
| Tab | Open navigation |
| F | Toggle fullscreen |
| Esc | Exit fullscreen |
| C | Toggle comments |
| R | Go to the first slide of the current presentation |
| Key | Action |
|---|---|
| ← or Tab + Shift | Previous page |
| → or Tab | Next page |
| Enter | Select page |
| Esc | Close navigation |