Integration Examples
Vue & Nuxt Integration
Direct embeds with publishable keys (no backend proxy)
Vue (After)
<template>
<img
:src="`https://logos.getquikturn.io/${domain}?token=${publishableKey}&size=${size}`"
:alt="`${domain} logo`"
loading="lazy"
/>
</template>
<script setup>
const publishableKey = import.meta.env.VITE_QUIKTURN_PUBLISHABLE_KEY;
defineProps({
domain: { type: String, required: true },
size: { type: Number, default: 64 },
});
</script>Add &theme=light|dark or &greyscale=true if needed.
Nuxt 3 (After)
<!-- components/QuikturnLogo.vue -->
<template>
<img
:src="logoUrl"
:alt="`${domain} logo`"
loading="lazy"
/>
</template>
<script setup>
const props = defineProps({
domain: { type: String, required: true },
size: { type: Number, default: 64 },
});
const config = useRuntimeConfig();
const logoUrl = computed(
() =>
`https://logos.getquikturn.io/${props.domain}?token=${config.public.quikturnKey}&size=${props.size}`
);
</script>