(READ ONLY) Margin is an open annotation layer for the internet. Powered by the AT Protocol.
margin.at
extension
web
atproto
comments
1/** @type {import('tailwindcss').Config} */
2import defaultTheme from "tailwindcss/defaultTheme";
3
4export default {
5 darkMode: ["selector", '[data-theme="dark"]'],
6 content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"],
7 theme: {
8 extend: {
9 fontFamily: {
10 sans: ["Inter", ...defaultTheme.fontFamily.sans],
11 display: ["Outfit", ...defaultTheme.fontFamily.sans],
12 },
13 colors: {
14 primary: {
15 50: "#f5f3ff",
16 100: "#ede9fe",
17 200: "#ddd6fe",
18 300: "#c4b5fd",
19 400: "#a78bfa",
20 500: "#8b5cf6",
21 600: "#7c3aed",
22 700: "#6d28d9",
23 800: "#5b21b6",
24 900: "#4c1d95",
25 950: "#2e1065",
26 },
27 surface: {
28 50: "#f8fafc",
29 100: "#f1f5f9",
30 200: "#e2e8f0",
31 300: "#cbd5e1",
32 400: "#94a3b8",
33 500: "#64748b",
34 600: "#475569",
35 700: "#334155",
36 800: "#1e293b",
37 900: "#0f172a",
38 950: "#020617",
39 },
40 },
41 animation: {
42 "fade-in": "fadeIn 0.3s ease-out",
43 },
44 keyframes: {
45 fadeIn: {
46 "0%": { opacity: "0" },
47 "100%": { opacity: "1" },
48 },
49 },
50 boxShadow: {
51 sm: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
52 DEFAULT:
53 "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
54 md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
55 lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",
56 },
57 },
58 },
59 plugins: [],
60};