Vue Playground

Vue 3 single-file component playground.

Frontend
<template>
  <div class="card">
    <h1>Hello Vue 3</h1>
    <p>Count: {{ count }}</p>
    <button @click="count++">Add one</button>
  </div>
</template>

<script setup>
import { ref } from 'vue';
const count = ref(0);
</script>

<style>
.card { font-family: system-ui; padding: 24px; max-width: 320px; }
button { margin-top: 8px; padding: 6px 12px; }
</style>

About this playground

Author Vue 3 components with the Composition API and reactivity. Multi-file, npm imports, and live preview.

Related Playground Tools