(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: "#eff6ff",
16 100: "#dbeafe",
17 200: "#bfdbfe",
18 300: "#93c5fd",
19 400: "#60a5fa",
20 500: "#3b82f6",
21 600: "#2563eb",
22 700: "#1d4ed8",
23 800: "#1e40af",
24 900: "#1e3a8a",
25 950: "#172554",
26 },
27 surface: {
28 50: "#fafafa",
29 100: "#f4f4f5",
30 200: "#e4e4e7",
31 300: "#d4d4d8",
32 400: "#a1a1aa",
33 500: "#71717a",
34 600: "#52525b",
35 700: "#3f3f46",
36 800: "#27272a",
37 900: "#18181b",
38 950: "#09090b",
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};