Portfolios · React
Film composer
Moody dark portfolio for a film and TV composer, with credits, a career timeline and how scoring works.

What you get
A dark portfolio for a composer for film, TV and games: selected scores, a credits timeline, how a scoring project runs, notes from directors and a contact form for producers. All content lives in src/site.ts.
Files
Exactly what is copied into a new project: 13 files, nothing generated.
Explorer 13
import type { Site } from "./types"; /** Everything this site shows. Edit freely. */export const site: Site = { "brand": "Elias Varga", "nav": [ { "label": "Scores", "href": "#scores" }, { "label": "Credits", "href": "#credits" }, { "label": "Process", "href": "#process" } ], "navCta": { "label": "Contact", "href": "#contact" }, "sections": [ { "kind": "hero", "variant": "center", "eyebrow": "Composer for film, television & games · Budapest", "title": "Music that sits under the picture, not on top of it.", "text": "Scores for independent features, documentary series and narrative games. Strings, piano and a lot of prepared instruments, recorded with players in Budapest and Vienna.", "primary": { "label": "Listen to scores", "href": "#scores" }, "secondary": { "label": "Contact", "href": "#contact" }, "visual": { "type": "mock", "title": "Now playing: Winter Quarters (OST)", "rows": [ { "label": "1. Arrival at the yard", "value": "2:48" }, { "label": "2. Ice on the rigging", "value": "3:31", "tone": "#93a0b0" }, { "label": "3. Letters home", "value": "4:05" }, { "label": "4. The long night", "value": "6:12", "tone": "#93a0b0" } ], "footer": "String quartet, prepared piano, cimbalom · 14 tracks, 47 minutes" } }, { "kind": "projects", "id": "scores", "eyebrow": "Selected scores", "title": "Recent work", "items": [ { "title": "Winter Quarters", "tag": "Feature film, period drama, 108 min", "year": "2026", "tone": "#1e293b" }, { "title": "The River Remembers", "tag": "Documentary series, 6 × 50 min", "year": "2025", "tone": "#0c4a6e" }, { "title": "Lanternfall", "tag": "Narrative game, 3 hours of adaptive score", "year": "2024", "tone": "#334155" }, { "title": "Small Hours", "tag": "Short film, 22 min", "year": "2023", "tone": "#1f2937" } ] }, { "kind": "timeline", "id": "credits", "eyebrow": "Credits", "title": "Career so far", "items": [ { "period": "2026", "title": "Winter Quarters", "text": "Original score for a feature film; soundtrack released on streaming and vinyl." }, { "period": "2025", "title": "The River Remembers", "text": "Main theme and score for a public-broadcast documentary series." }, { "period": "2024", "title": "Lanternfall", "text": "Adaptive score for an independent game, with layers that respond to the player's light." }, { "period": "2019 – 2023", "title": "Orchestrator and additional music", "text": "Orchestration for twelve features and series while building my own credits." } ] }, { "kind": "steps", "id": "process", "eyebrow": "Process", "title": "How a score comes together", "items": [ { "title": "Spotting session", "text": "We watch the cut together and decide where music goes, and just as important, where it doesn't." }, { "title": "Sketches to picture", "text": "Mock-ups for every cue so you can hear the score against the edit before anything is recorded." }, { "title": "Record and mix", "text": "Live sessions with players, mixed in stereo and 5.1, stems delivered for the final dub." } ] }, { "kind": "quotes", "eyebrow": "Directors", "title": "From the people I've scored for", "items": [ { "quote": "Elias took out half the music I asked for, and the film got twice as sad. He was right.", "name": "Katalin R.", "role": "Director, Winter Quarters" }, { "quote": "The main theme does more storytelling in thirty seconds than our narration does in three minutes.", "name": "Peter H.", "role": "Series producer" }, { "quote": "The adaptive layers never repeat in a way players notice. That's very hard to do.", "name": "Lena F.", "role": "Audio director, Lanternfall" } ] }, { "kind": "contact", "eyebrow": "Contact", "title": "Talk about your project", "text": "Send a link to the cut or the script, your timeline and where you are in the edit. Representation enquiries through the same form.", "fields": [ "name", "email", "company", "message" ], "button": "Send message" } ], "footer": { "text": "Elias Varga, composer for film, television and games.", "columns": [ { "title": "Listen", "links": [ "Bandcamp", "Showreel" ] }, { "title": "Contact", "links": [ "studio@eliasvarga.com" ] } ], "legal": "© Elias Varga. Sample content: replace it in src/site.ts." }};Remix
Remix this template
Describe what to change and the agent starts from Film composer's files. The box is already started for you: finish “Start from Film composer and …”
Dependencies
Documented from the template's package.json. The runtime has a prebuilt dependency set for Vite + React + TypeScript, so installs are fast.
- react^19.1.0
- react-dom^19.1.0
- vite^6.3.0
- @vitejs/plugin-react^4.4.0
- tailwindcss^4.1.0
- @tailwindcss/vite^4.1.0
- typescript^5.8.0
How it runs
- Framework
- Vite + React + TypeScript
- Dev command
- npm run dev
- Build command
- npm run build
- Output directory
- dist
- Port
- 5173
- Entry route
- /
Projects run in an isolated sandbox with a live preview. Read the projects documentation for settings, snapshots and deployment.
Keep browsing
All templates
Brand design studio
Bold dark site for an independent brand and identity studio, with case work, services and team.

Product designer
Case-study portfolio for a product designer, with process, experience timeline and references.

3D & motion designer
High-contrast dark portfolio for a 3D and motion designer, with reels, projects, rates and process.
Build on Film composer
Create a free account, start from this template, and ask the AI agent to turn it into your app.