Web → music · guide and demo

What does my website sound like?

It isn't a metaphor: your site already has a tempo, a key and a timbre. They live in its palette, its typography and the way it moves. Paste a URL and hear it turned into generative music. No samples, no sign-up and no uploads.

It takes a few seconds. The music is synthesised in your browser; there is no pre-recorded audio.

  • 0 samples
  • 100% synthesised
  • No sign-up

The short answer

It sounds like how it's designed, not what it says.

When people ask what their website sounds like, they usually expect a specific song. In reality, a site sounds like the sum of its visual decisions: background colour, contrast, type family, the air between blocks and the speed at which things move. vibedom reads those signals and translates them into a sound seed — key, tempo, timbres and effects — that your browser performs live.

That's why two sites with the same copy can sound completely different. A ceramics shop with an ivory background and a classic serif tends towards a slow Lydian pad with wide reverb. A cyberpunk portfolio in black and acid green lands on a low Phrygian mode, metallic arpeggios and more echo. There is no single answer: there is an identity.

And no, nothing is uploaded. Only public HTML and CSS are read to extract signals; the music is synthesised in your browser with Tone.js. Zero samples, zero pre-recorded audio and zero playlists.

Design → sound

Six visual signals, six musical decisions.

It isn't an exact mapping or a jingle: it's a rule system. These are the main ones.

Colour and contrast

Mode and energy

Dark backgrounds with highly saturated accents tend to ask for lower modes and slower attacks. Light, warm backgrounds lean towards major or Lydian scales with softer timbres.

Typography

Timbre

An editorial serif becomes sine pads; a monospaced face becomes square waves and precise arpeggios; a geometric sans becomes clean, bright triangles.

Motion

Tempo and density

Fast animations and transitions raise the BPM and the arpeggio density. Static or slow-moving sites lower the pulse and leave more silence between notes.

Whitespace

Reverb and air

Spacious, luminous layouts translate into long reverb tails and isolated notes. Dense layouts shorten the reverb and let rhythm take up more room.

Hierarchy

Arpeggio and register

Strong hierarchy with bold headlines produces a clear arpeggio and a defined octave separation. A flatter page leans towards a more continuous drone with less melodic foreground.

Accents

Harmonic colour

The accent colour tunes filter brightness, delay amount and chorus depth. An acid accent lights up the spectrum; an earthy one dims it and pulls it towards the centre.

Transparency

What vibedom reads (and what it never touches).

The analysis works only with what any visitor can see. If a site hides its content behind a login or renders everything with JavaScript, the result may fall short.

It does read

  • The public HTML of the page you pass in.
  • Up to four public stylesheets.
  • Computed colours, contrast and dominant background.
  • Type families and heading hierarchy.
  • Animations, transitions and motion signals.

It never touches

  • Private areas, dashboards or content behind a login.
  • Images, videos or text used to train models.
  • Cookies, analytics or your visitors' data.
  • Audio, screenshots or browsing history.
  • Your URL or HTML: they are not written to disk.

Try it

From curiosity to play in under a minute.

  1. 01

    Paste your URL

    Use the form above. In a few seconds you'll see the detected vibe and hear it without installing anything.

  2. 02

    Open it in the playground

    If you want to see the JSON seed, move tempo, brightness, spaciousness and density, or watch the spectrum, the lab has the controls.

  3. 03

    Share it or embed it

    Copy a link with the seed inside or generate a snippet for Webflow, Framer or any HTML. Visitors listen without spending AI credits.

Edge cases

What if my website is minimal?

Even better. Sites with little visual noise tend to produce the cleanest soundscapes: fewer colours, less motion and more whitespace become long drones, sparse notes and a very defined mood. A black-and-white page with a single sans can sound more interesting than a dashboard full of gradients.

If your site uses the browser's default styles, vibedom still has something to work with: contrast, hierarchy and system typography are signals too. And if the analyser cannot reach the page, the demo answers with a local seed so you never end up with silence.

FAQ

Common questions about how a website sounds.

What does my website sound like, exactly?

It sounds like a generative piece built from its own visual traits. Palette and contrast set the mode and energy; typography suggests the timbres; motion sets the tempo and density. It is not a fixed song, but a sonic identity performed live.

Will the same website always sound the same?

No. The seed defines the identity — key, tempo, timbres and effects — but the engine walks scales, chords and arpeggios with harmonic rules. Each performance changes in the details while keeping the site's character.

Do I need to sign up or pay?

No. The demo is free and open. You only need a public URL and a modern browser. The presets still work when the analyser is unavailable.

Do you store my URL or my website's content?

No. The request downloads the public HTML and stylesheets, extracts signals and returns the seed. We do not store screenshots, HTML or content, and the seed is cached in memory for one hour only.

Does it work with WordPress, Webflow, Framer or Shopify?

Yes, as long as the page is public and serves accessible HTML and CSS. Some sites block bots or render everything with JavaScript; in those cases the analysis may fall short, but the demo still responds with a local seed.

Can I embed this sound on my own website?

Yes. The playground generates a snippet with the seed embedded. The widget is under 5 KB, lives in Shadow DOM and only loads Tone.js when someone presses the button, so there is no cost per visitor and no AI calls.

Which browsers and devices do I need?

Any modern browser with the Web Audio API: recent Chrome, Edge, Firefox or Safari, on desktop or mobile. Audio always starts after a gesture (pressing Play or Hear my site), as autoplay policies require.

Can I share the sound of a website?

Yes. The playground includes a shareable link that carries the full seed in the URL fragment. Anyone who opens it hears the same variation without spending AI credits or touching the backend.

Start with your own site

The answer is one URL away.

Paste your domain and listen. If you want to see the seed, open the playground; if you want to embed the sound, the snippet is ready.

Hear my site