Shakō: A sleek, modern linktree alternative built with Astro and React. It's designed to be easily customizable, self-hostable, and provides a modern look and feel for showcasing your links. An optional hosted version is available at keksiqc/shako.me.
Key features:
- Customizable: Easily change the appearance and functionality to match your personal brand.
- Self-hostable: Deploy your linktree on your own server for complete control.
- Modern design: A clean and professional look that stands out.
- Astro
- React
- Tailwind CSS
- Shadcn/UI
- Lanyard
git clone https://github.com/keksiqc/shako
cd shako
bun install
bun run devAll configuration is done through the shako.config.ts file. Here's a comprehensive guide to all available options:
page: {
title: string, // Page title shown in browser tab
footer: boolean | string, // Show footer (true/false) or custom footer text
borderRadius?: number, // Border radius for UI elements (0-1, where 1 = full radius)
background?: string | object, // Background style (see Background Options below)
redirects?: Record<string, string> // Redirects for custom domains
}You can redirect paths to other URLs.
redirects: {
'/discord': 'https://discord.gg/keksi',
}You can use predefined backgrounds or create custom ones:
Predefined backgrounds:
'dot'- Dot pattern'grid'- Grid pattern'dashed-grid'- Dashed grid pattern'flickering-grid'- Flickering grid effect'animated-grid'- Animated grid pattern'none'- No background pattern
Custom backgrounds:
background: {
type: 'image' | 'color' | 'gradient' | 'custom',
value: string | GradientConfig | Record<string, string>
}Gradient example:
background: {
type: 'gradient',
value: {
type: 'linear' | 'radial',
colors: ['#ff0000', '#00ff00', '#0000ff'],
direction: 45 // degrees for linear gradients
}
}user: {
name?: string, // Display name (overrides Discord username if set)
avatar?: string, // Avatar URL (overrides Discord avatar if set)
bio?: string, // Bio text (overrides Discord status if set)
discordId: string // Required: Your Discord user ID for Lanyard integration
}Note: If name or avatar are not specified, Shakō will automatically fetch this information from Discord via Lanyard.
api: {
lanyardUrl: string // Lanyard API endpoint (default: 'https://api.lanyard.rest/')
}Small icon buttons displayed at the top of the page:
social?: [
{
icon: string, // Icon name (see supported icons below)
url: string, // Link URL
style?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link'
}
]Large featured buttons for main links:
primary?: [
{
label: string, // Button text
icon: string, // Icon name
url: string, // Link URL
style?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link',
size?: 'default' | 'sm' | 'lg' | 'xl'
}
]See Simple Icons for a list of supported icons.
import type { Config } from '@/types'
const config: Config = {
page: {
title: 'My Links - John Doe',
footer: true,
borderRadius: 0.5,
background: 'flickering-grid',
},
user: {
discordId: '123456789012345678',
// name: 'John Doe', // Optional: Override Discord username
// avatar: 'https://...', // Optional: Override Discord avatar
// bio: 'Software Engineer', // Optional
},
api: {
lanyardUrl: 'https://api.lanyard.rest/',
},
links: {
social: [
{ icon: 'github', url: 'https://github.com/johndoe' },
{ icon: 'x', url: 'https://x.com/johndoe' },
],
primary: [
{
label: 'My Portfolio',
icon: 'globe',
url: 'https://johndoe.dev',
style: 'default',
size: 'xl'
},
{
label: 'Contact Me',
icon: 'mail',
url: 'mailto:john@example.com',
style: 'outline'
}
],
},
}
export default configTo deploy Shakō:
- Build the project:
bun run build- Deploy the
distdirectory to your preferred hosting platform.
Follow the official Astro deployment guide for platform-specific instructions.
Shakō is licensed under the GPL-3.0 License - see the LICENSE file for details.
Contributions are welcome! Please follow these guidelines:
- Report bugs by opening an issue
- Suggest new features by opening an issue
- Submit pull requests with improvements
For major changes, please open an issue first to discuss what you would like to change.