-
+
Use format like "mod+shift+p" or "escape". "mod" is Cmd on
Mac, Ctrl on Windows/Linux.
@@ -268,7 +268,7 @@ export default function Settings() {
@@ -348,7 +348,7 @@ export default function Settings() {
@@ -413,7 +413,7 @@ export default function Settings() {
@@ -462,7 +462,7 @@ export default function Settings() {
size="sm"
disabled={history.length === 0}
>
-
+
Clear
@@ -504,7 +504,7 @@ export default function Settings() {
@@ -547,14 +547,14 @@ export default function Settings() {
-
+
Clear Everything
@@ -606,14 +606,14 @@ export default function Settings() {
-
+
Delete Account
diff --git a/components/theme-mode-selector.tsx b/components/theme-mode-selector.tsx
index 107762ff..4e99e66f 100644
--- a/components/theme-mode-selector.tsx
+++ b/components/theme-mode-selector.tsx
@@ -1,7 +1,7 @@
"use client";
import * as React from "react";
-import { Moon, Sun } from "lucide-react";
+import { PiMoon, PiSun } from "react-icons/pi";
import { Button } from "@/components/ui/button";
import {
@@ -30,8 +30,8 @@ export function ThemeModeSelector({ className }: { className?: string }) {
diff --git a/components/theme-selector.tsx b/components/theme-selector.tsx
index 2011af37..135a2062 100644
--- a/components/theme-selector.tsx
+++ b/components/theme-selector.tsx
@@ -1,7 +1,7 @@
"use client";
import * as React from "react";
-import { Check, ChevronsUpDown } from "lucide-react";
+import { PiCheck, PiCaretUpDown } from "react-icons/pi";
import { cn } from "@/lib/utils";
import { Button } from "@/components/ui/button";
@@ -47,7 +47,7 @@ export function ThemeSelector({ className }: { className?: string }) {
}}
>
{themeOption.label}
- svg]:size-3.5", className)}
{...props}
>
- {children ?? }
+ {children ?? }
);
}
@@ -92,7 +92,7 @@ function BreadcrumbEllipsis({
className={cn("flex size-9 items-center justify-center", className)}
{...props}
>
-
+
More
);
diff --git a/components/ui/checkbox.tsx b/components/ui/checkbox.tsx
index f24ad458..e8a65bba 100644
--- a/components/ui/checkbox.tsx
+++ b/components/ui/checkbox.tsx
@@ -1,6 +1,6 @@
import * as React from "react";
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
-import { CheckIcon } from "lucide-react";
+import { PiCheck } from "react-icons/pi";
import { cn } from "@/lib/utils";
@@ -21,7 +21,7 @@ function Checkbox({
data-slot="checkbox-indicator"
className="grid place-content-center text-current transition-none"
>
-
+
);
diff --git a/components/ui/command.tsx b/components/ui/command.tsx
index c1c29b41..1b8f8ec6 100644
--- a/components/ui/command.tsx
+++ b/components/ui/command.tsx
@@ -1,6 +1,6 @@
import * as React from "react";
import { Command as CommandPrimitive } from "cmdk";
-import { SearchIcon } from "lucide-react";
+import { PiMagnifyingGlass } from "react-icons/pi";
import { cn } from "@/lib/utils";
import {
@@ -68,7 +68,7 @@ function CommandInput({
data-slot="command-input-wrapper"
className="flex h-9 items-center gap-2 border-b px-3"
>
-
+
-
+
Close
)}
diff --git a/components/ui/dropdown-menu.tsx b/components/ui/dropdown-menu.tsx
index 7ec08d26..ca6c7595 100644
--- a/components/ui/dropdown-menu.tsx
+++ b/components/ui/dropdown-menu.tsx
@@ -1,6 +1,6 @@
import * as React from "react";
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
-import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
+import { PiCheck, PiCaretRight, PiCircle } from "react-icons/pi";
import { cn } from "@/lib/utils";
@@ -98,7 +98,7 @@ function DropdownMenuCheckboxItem({
>
-
+
{children}
@@ -133,7 +133,7 @@ function DropdownMenuRadioItem({
>
-
+
{children}
@@ -215,7 +215,7 @@ function DropdownMenuSubTrigger({
{...props}
>
{children}
-
+
);
}
diff --git a/components/ui/sheet.tsx b/components/ui/sheet.tsx
index 609cff0e..708b4293 100644
--- a/components/ui/sheet.tsx
+++ b/components/ui/sheet.tsx
@@ -1,6 +1,6 @@
import * as React from "react";
import * as SheetPrimitive from "@radix-ui/react-dialog";
-import { XIcon } from "lucide-react";
+import { PiX } from "react-icons/pi";
import { cn } from "@/lib/utils";
@@ -71,7 +71,7 @@ function SheetContent({
>
{children}
-
+
Close
diff --git a/components/ui/sidebar.tsx b/components/ui/sidebar.tsx
index 752037c0..890c74c5 100644
--- a/components/ui/sidebar.tsx
+++ b/components/ui/sidebar.tsx
@@ -3,7 +3,7 @@
import * as React from "react";
import { Slot } from "@radix-ui/react-slot";
import { cva, type VariantProps } from "class-variance-authority";
-import { PanelLeftIcon } from "lucide-react";
+import { PiSidebarSimple } from "react-icons/pi";
import { useIsMobile } from "@/hooks/use-mobile";
import { cn } from "@/lib/utils";
@@ -275,7 +275,7 @@ function SidebarTrigger({
}}
{...props}
>
-
+
Toggle Sidebar
);
diff --git a/components/ui/sonner.tsx b/components/ui/sonner.tsx
index c9cd094b..1a65b5b9 100644
--- a/components/ui/sonner.tsx
+++ b/components/ui/sonner.tsx
@@ -1,10 +1,10 @@
import {
- CircleCheckIcon,
- InfoIcon,
- Loader2Icon,
- OctagonXIcon,
- TriangleAlertIcon,
-} from "lucide-react";
+ PiCheckCircle,
+ PiInfo,
+ PiSpinner,
+ PiXCircle,
+ PiWarning,
+} from "react-icons/pi";
import { useTheme } from "next-themes";
import { Toaster as Sonner, type ToasterProps } from "sonner";
@@ -16,11 +16,11 @@ const Toaster = ({ ...props }: ToasterProps) => {
theme={theme as ToasterProps["theme"]}
className="toaster group"
icons={{
- success: ,
- info: ,
- warning: ,
- error: ,
- loading: ,
+ success: ,
+ info: ,
+ warning: ,
+ error: ,
+ loading: ,
}}
style={
{
diff --git a/components/ui/spinner.tsx b/components/ui/spinner.tsx
index 055ac767..31a18364 100644
--- a/components/ui/spinner.tsx
+++ b/components/ui/spinner.tsx
@@ -1,10 +1,10 @@
-import { Loader2Icon } from "lucide-react";
+import { PiSpinner } from "react-icons/pi";
import { cn } from "@/lib/utils";
function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
return (
- ({
label: tool.label,
@@ -52,7 +52,7 @@ export const MENU_ITEMS: MenuItem[] = [
{
label: "Gmaes",
- icon: Gamepad2,
+ icon: PiGameController,
experimental: true,
children: [
{
@@ -69,13 +69,13 @@ export const MENU_ITEMS: MenuItem[] = [
{
label: "Backups",
href: "/backups",
- icon: ArchiveRestore,
+ icon: PiArchive,
experimental: true,
},
{
label: "Admin",
href: "/admin",
- icon: Shield,
+ icon: PiShield,
requiresAdmin: true,
},
{
@@ -88,13 +88,13 @@ export const MENU_ITEMS: MenuItem[] = [
{
label: "About",
href: "/about",
- icon: FileText,
+ icon: PiFileText,
experimental: true,
},
{
label: "Privacy",
href: "/privacy",
- icon: ShieldUser,
+ icon: PiShieldCheck,
experimental: true,
},
];
diff --git a/lib/themes/default.css b/lib/themes/default.css
index 62e35de1..be6ac86f 100644
--- a/lib/themes/default.css
+++ b/lib/themes/default.css
@@ -1,68 +1,125 @@
.theme-default {
- --radius: 0.625rem;
- --background: oklch(1 0 0);
- --foreground: oklch(0.145 0 0);
- --card: oklch(1 0 0);
- --card-foreground: oklch(0.145 0 0);
- --popover: oklch(1 0 0);
- --popover-foreground: oklch(0.145 0 0);
- --primary: oklch(0.205 0 0);
- --primary-foreground: oklch(0.985 0 0);
- --secondary: oklch(0.97 0 0);
- --secondary-foreground: oklch(0.205 0 0);
- --muted: oklch(0.97 0 0);
- --muted-foreground: oklch(0.556 0 0);
- --accent: oklch(0.97 0 0);
- --accent-foreground: oklch(0.205 0 0);
- --destructive: oklch(0.577 0.245 27.325);
- --border: oklch(0.922 0 0);
- --input: oklch(0.922 0 0);
- --ring: oklch(0.708 0 0);
- --chart-1: oklch(0.646 0.222 41.116);
- --chart-2: oklch(0.6 0.118 184.704);
- --chart-3: oklch(0.398 0.07 227.392);
- --chart-4: oklch(0.828 0.189 84.429);
- --chart-5: oklch(0.769 0.188 70.08);
- --sidebar: oklch(0.985 0 0);
- --sidebar-foreground: oklch(0.145 0 0);
- --sidebar-primary: oklch(0.205 0 0);
- --sidebar-primary-foreground: oklch(0.985 0 0);
- --sidebar-accent: oklch(0.97 0 0);
- --sidebar-accent-foreground: oklch(0.205 0 0);
- --sidebar-border: oklch(0.922 0 0);
- --sidebar-ring: oklch(0.708 0 0);
+ --background: #ffffff;
+ --foreground: #000000;
+ --card: #ffffff;
+ --card-foreground: #000000;
+ --popover: #ffffff;
+ --popover-foreground: #000000;
+ --primary: #00a63e;
+ --primary-foreground: #ffffff;
+ --secondary: #f5f5f5;
+ --secondary-foreground: #000000;
+ --muted: #f5f5f5;
+ --muted-foreground: #737373;
+ --accent: #f5f5f5;
+ --accent-foreground: #000000;
+ --destructive: #e7000b;
+ --destructive-foreground: #ffffff;
+ --border: #e5e5e5;
+ --input: #e5e5e5;
+ --ring: #a1a1a1;
+ --chart-1: #daebff;
+ --chart-2: #6ea2f8;
+ --chart-3: #5384f2;
+ --chart-4: #3968e7;
+ --chart-5: #254acc;
+ --sidebar: #fbfbfb;
+ --sidebar-foreground: #000000;
+ --sidebar-primary: #000000;
+ --sidebar-primary-foreground: #ffffff;
+ --sidebar-accent: #f5f5f5;
+ --sidebar-accent-foreground: #1d1d1f;
+ --sidebar-border: #e5e5e5;
+ --sidebar-ring: #a1a1a1;
+ --font-sans:
+ ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
+ Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+ "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+ --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
+ --font-mono:
+ ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+ "Courier New", monospace;
+ --radius: 1.5rem;
+ --shadow-x: 0;
+ --shadow-y: 1px;
+ --shadow-blur: 3px;
+ --shadow-spread: 0px;
+ --shadow-opacity: 0.1;
+ --shadow-color: oklch(0 0 0);
+ --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+ --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+ --shadow-sm:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+ --shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+ --shadow-md:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 2px 4px -1px hsl(0 0% 0% / 0.1);
+ --shadow-lg:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 4px 6px -1px hsl(0 0% 0% / 0.1);
+ --shadow-xl:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 8px 10px -1px hsl(0 0% 0% / 0.1);
+ --shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
+ --tracking-normal: 0em;
+ --spacing: 0.28rem;
}
.theme-default.dark {
- --background: oklch(0.145 0 0);
- --foreground: oklch(0.985 0 0);
- --card: oklch(0.205 0 0);
- --card-foreground: oklch(0.985 0 0);
- --popover: oklch(0.205 0 0);
- --popover-foreground: oklch(0.985 0 0);
- --primary: oklch(0.922 0 0);
- --primary-foreground: oklch(0.205 0 0);
- --secondary: oklch(0.269 0 0);
- --secondary-foreground: oklch(0.985 0 0);
- --muted: oklch(0.269 0 0);
- --muted-foreground: oklch(0.708 0 0);
- --accent: oklch(0.269 0 0);
- --accent-foreground: oklch(0.985 0 0);
- --destructive: oklch(0.704 0.191 22.216);
- --border: oklch(1 0 0 / 10%);
- --input: oklch(1 0 0 / 15%);
- --ring: oklch(0.556 0 0);
- --chart-1: oklch(0.488 0.243 264.376);
- --chart-2: oklch(0.696 0.17 162.48);
- --chart-3: oklch(0.769 0.188 70.08);
- --chart-4: oklch(0.627 0.265 303.9);
- --chart-5: oklch(0.645 0.246 16.439);
- --sidebar: oklch(0.205 0 0);
- --sidebar-foreground: oklch(0.985 0 0);
- --sidebar-primary: oklch(0.488 0.243 264.376);
- --sidebar-primary-foreground: oklch(0.985 0 0);
- --sidebar-accent: oklch(0.269 0 0);
- --sidebar-accent-foreground: oklch(0.985 0 0);
- --sidebar-border: oklch(1 0 0 / 10%);
- --sidebar-ring: oklch(0.556 0 0);
+ --background: #000000;
+ --foreground: #ffffff;
+ --card: #080808;
+ --card-foreground: #ffffff;
+ --popover: #050505;
+ --popover-foreground: #ffffff;
+ --primary: #008236;
+ --primary-foreground: #ffffff;
+ --secondary: #010101;
+ --secondary-foreground: #ffffff;
+ --muted: #010101;
+ --muted-foreground: #888888;
+ --accent: #111111;
+ --accent-foreground: #ffffff;
+ --destructive: #f40021;
+ --destructive-foreground: #ffffff;
+ --border: #111111;
+ --input: #111111;
+ --ring: #222222;
+ --chart-1: #daebff;
+ --chart-2: #6ea2f8;
+ --chart-3: #5384f2;
+ --chart-4: #3968e7;
+ --chart-5: #254acc;
+ --sidebar: #080808;
+ --sidebar-foreground: #ffffff;
+ --sidebar-primary: #ffffff;
+ --sidebar-primary-foreground: #000000;
+ --sidebar-accent: #111111;
+ --sidebar-accent-foreground: #ffffff;
+ --sidebar-border: #111111;
+ --sidebar-ring: #222222;
+ --font-sans:
+ ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
+ Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+ "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+ --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
+ --font-mono:
+ ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+ "Courier New", monospace;
+ --radius: 1.5rem;
+ --shadow-x: 0;
+ --shadow-y: 1px;
+ --shadow-blur: 3px;
+ --shadow-spread: 0px;
+ --shadow-opacity: 0.1;
+ --shadow-color: oklch(0 0 0);
+ --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+ --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+ --shadow-sm:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+ --shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+ --shadow-md:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 2px 4px -1px hsl(0 0% 0% / 0.1);
+ --shadow-lg:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 4px 6px -1px hsl(0 0% 0% / 0.1);
+ --shadow-xl:
+ 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 8px 10px -1px hsl(0 0% 0% / 0.1);
+ --shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
}
diff --git a/lib/tools.ts b/lib/tools.ts
index 5558e038..5a71edac 100644
--- a/lib/tools.ts
+++ b/lib/tools.ts
@@ -1,112 +1,112 @@
import {
- Binary,
- Calculator,
- CaseSensitive,
- Clock,
- Code,
- Dices,
- FileJson,
- FileText,
- Fingerprint,
- Hash,
- Key,
- Link,
- Lock,
- Palette,
- QrCode,
- Scale,
- Type,
-} from "lucide-react";
+ PiBinary,
+ PiCalculator,
+ PiTextAa,
+ PiClock,
+ PiCode,
+ PiDiceFive,
+ PiFileText,
+ PiFingerprint,
+ PiHash,
+ PiKey,
+ PiLink,
+ PiLock,
+ PiPalette,
+ PiQrCode,
+ PiArrowsLeftRight,
+ PiTextT,
+ PiCursorText,
+} from "react-icons/pi";
export const TOOLS = [
{
label: "Calculator",
id: "calculator",
- icon: Calculator,
+ icon: PiCalculator,
},
{
label: "Unit Converter",
id: "unit-converter",
- icon: Scale,
+ icon: PiArrowsLeftRight,
},
{
label: "Word Counter",
id: "word-counter",
- icon: Type,
+ icon: PiCursorText,
},
{
label: "Password Generator",
id: "password-generator",
- icon: Key,
+ icon: PiKey,
},
{
label: "Random Number",
id: "random-number",
- icon: Dices,
+ icon: PiDiceFive,
},
{
label: "Stopwatch & Timer",
id: "stopwatch-timer",
- icon: Clock,
+ icon: PiClock,
},
{
label: "Base64 Converter",
id: "base64-converter",
- icon: Binary,
+ icon: PiBinary,
},
{
label: "Color Picker",
id: "color-picker",
- icon: Palette,
+ icon: PiPalette,
},
{
label: "QR Code Generator",
id: "qr-code-generator",
- icon: QrCode,
+ icon: PiQrCode,
},
{
label: "UUID Generator",
id: "uuid-generator",
- icon: Fingerprint,
+ icon: PiFingerprint,
},
{
label: "JSON Formatter",
id: "json-formatter",
- icon: FileJson,
+ icon: PiCode,
},
{
label: "Roman Numeral Converter",
id: "roman-numeral",
- icon: Hash,
+ icon: PiHash,
},
{
label: "Text Case Converter",
id: "text-case",
- icon: CaseSensitive,
+ icon: PiTextAa,
},
{
label: "Hash Generator",
id: "hash-generator",
- icon: Lock,
+ icon: PiLock,
},
{
label: "URL Encoder/Decoder",
id: "url-encoder",
- icon: Link,
+ icon: PiLink,
},
{
label: "Markdown Preview",
id: "markdown-preview",
- icon: FileText,
+ icon: PiFileText,
},
{
label: "Regex Tester",
id: "regex-tester",
- icon: Code,
+ icon: PiCode,
},
{
label: "Number Base Converter",
id: "number-base",
- icon: Hash,
+ icon: PiHash,
},
];
diff --git a/package.json b/package.json
index a86b8d14..61137d69 100644
--- a/package.json
+++ b/package.json
@@ -9,8 +9,8 @@
"typecheck": "react-router typegen && tsc"
},
"dependencies": {
- "@convex-dev/better-auth": "^0.9.7",
- "@daveyplate/better-auth-ui": "^3.2.8",
+ "@convex-dev/better-auth": "^0.9.11",
+ "@daveyplate/better-auth-ui": "^3.3.12",
"@radix-ui/react-alert-dialog": "^1.1.15",
"@radix-ui/react-checkbox": "^1.3.3",
"@radix-ui/react-collapsible": "^1.1.12",
@@ -22,49 +22,50 @@
"@radix-ui/react-switch": "^1.2.6",
"@radix-ui/react-tabs": "^1.1.13",
"@radix-ui/react-tooltip": "^1.2.8",
- "@react-router/node": "^7.9.2",
- "@react-router/serve": "^7.9.2",
+ "@react-router/node": "^7.11.0",
+ "@react-router/serve": "^7.11.0",
"@tanstack/react-table": "^8.21.3",
"@types/md5": "^2.3.6",
- "@types/validator": "^13.15.8",
- "better-auth": "1.3.27",
+ "@types/validator": "^13.15.10",
+ "better-auth": "1.4.5",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cmdk": "^1.1.1",
- "convex": "^1.29.0",
+ "convex": "^1.31.2",
"current-git-branch": "^2.0.2",
- "isbot": "^5.1.31",
- "lucide-react": "^0.553.0",
+ "isbot": "^5.1.32",
"md5": "^2.3.0",
- "motion": "^12.23.24",
+ "motion": "^12.24.0",
"next-themes": "^0.4.6",
- "posthog-js": "^1.299.0",
+ "posthog-js": "^1.313.0",
"qrcode.react": "^4.2.0",
- "react": "^19.1.1",
- "react-dom": "^19.1.1",
+ "react": "^19.2.3",
+ "react-dom": "^19.2.3",
"react-hotkeys-hook": "^5.2.1",
- "react-router": "^7.9.2",
+ "react-icons": "^5.5.0",
+ "react-router": "^7.11.0",
"sonner": "^2.0.7",
- "tailwind-merge": "^3.3.1",
- "validator": "^13.15.23",
+ "tailwind-merge": "^3.4.0",
+ "validator": "^13.15.26",
"vaul": "^1.1.2",
- "zustand": "^5.0.8"
+ "zustand": "^5.0.9"
},
"devDependencies": {
- "@iconify-json/fa7-brands": "^1.2.0",
- "@react-router/dev": "^7.9.2",
+ "@iconify-json/fa7-brands": "^1.2.1",
+ "@react-router/dev": "^7.11.0",
"@svgr/core": "^8.1.0",
"@svgr/plugin-jsx": "^8.1.0",
"@tailwindcss/typography": "^0.5.19",
- "@tailwindcss/vite": "^4.1.13",
- "@types/node": "^22",
- "@types/react": "^19.1.13",
- "@types/react-dom": "^19.1.9",
- "tailwindcss": "^4.1.13",
+ "@tailwindcss/vite": "^4.1.18",
+ "@types/node": "^22.19.3",
+ "@types/react": "^19.2.7",
+ "@types/react-dom": "^19.2.3",
+ "baseline-browser-mapping": "^2.9.11",
+ "tailwindcss": "^4.1.18",
"tw-animate-css": "^1.4.0",
- "typescript": "^5.9.2",
+ "typescript": "^5.9.3",
"unplugin-icons": "^22.5.0",
- "vite": "^7.1.7",
+ "vite": "^7.3.0",
"vite-tsconfig-paths": "^5.1.4"
}
}