ATlast — you'll never need to find your favorites on another platform again. Find your favs in the ATmosphere.
atproto
1/** @type {import('tailwindcss').Config} */
2export default {
3 // Use media query dark mode to automatically respect system preference
4 darkMode: "media",
5
6 // Scan popup HTML and TypeScript files
7 content: [
8 "./src/popup/**/*.{html,ts}",
9 "./src/content/**/*.ts",
10 ],
11
12 // Extend with same custom config as web app
13 theme: {
14 extend: {
15 colors: {
16 firefly: {
17 glow: "#FCD34D",
18 amber: "#F59E0B",
19 orange: "#F97316",
20 pink: "#EC4899",
21 cyan: "#10D2F4",
22 },
23 cyan: { 250: "#72EEFD" },
24 purple: { 750: "#6A1DD1" },
25 yellow: { 650: "#C56508" },
26 orange: { 650: "#DF3F00" },
27 pink: { 650: "#CD206A" },
28 },
29 backgroundImage: ({ theme }) => ({
30 "firefly-banner": `linear-gradient(to right, ${theme("colors.yellow.400")}, ${theme("colors.orange.500")}, ${theme("colors.pink.600")})`,
31 "firefly-banner-dark": `linear-gradient(to right, ${theme("colors.yellow.600")}, ${theme("colors.orange.600")}, ${theme("colors.pink.700")})`,
32 }),
33 },
34 },
35};