diff --git a/templates/rescript-template-vite/index.html b/templates/rescript-template-vite/index.html
index 24f8684..77585cb 100644
--- a/templates/rescript-template-vite/index.html
+++ b/templates/rescript-template-vite/index.html
@@ -6,10 +6,11 @@
-
{"What is this about?"->React.string}
-
- {React.string("This is a simple template for a Vite project using ReScript & Tailwind CSS.")}
-
-
{React.string("Fast Refresh Test")}
+
+
+

+

+
+
{"Vite + ReScript"->React.string}
-
+
{React.string("Edit ")}
- {React.string("src/App.res")}
+ {React.string("src/App.res")}
{React.string(" and save to test Fast Refresh.")}
+
+ {React.string("Learn more about ")}
+
+ {React.string("ReScript")}
+ {React.string(".")}
+
+
}
diff --git a/templates/rescript-template-vite/src/Button.res b/templates/rescript-template-vite/src/Button.res
index fd695f8..4332426 100644
--- a/templates/rescript-template-vite/src/Button.res
+++ b/templates/rescript-template-vite/src/Button.res
@@ -1,7 +1,6 @@
// Styling from https://tailwind-elements.com/docs/standard/components/buttons/
let make = props =>
diff --git a/templates/rescript-template-vite/src/assets/rescript-logo.svg b/templates/rescript-template-vite/src/assets/rescript-logo.svg
new file mode 100644
index 0000000..c4741ce
--- /dev/null
+++ b/templates/rescript-template-vite/src/assets/rescript-logo.svg
@@ -0,0 +1,53 @@
+
diff --git a/templates/rescript-template-vite/src/assets/vite.svg b/templates/rescript-template-vite/src/assets/vite.svg
new file mode 100644
index 0000000..e7b8dfb
--- /dev/null
+++ b/templates/rescript-template-vite/src/assets/vite.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/templates/rescript-template-vite/src/index.css b/templates/rescript-template-vite/src/index.css
index b5c61c9..3e831dc 100644
--- a/templates/rescript-template-vite/src/index.css
+++ b/templates/rescript-template-vite/src/index.css
@@ -1,3 +1,16 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import "tailwindcss";
+
+@theme {
+ --color-rescript-50: oklch(97% 0.02 27);
+ --color-rescript-100: oklch(93% 0.04 27);
+ --color-rescript-200: oklch(87% 0.07 27);
+ --color-rescript-300: oklch(79% 0.12 27);
+ --color-rescript-400: oklch(71% 0.16 27);
+ --color-rescript-500: oklch(63% 0.19 27);
+ --color-rescript-600: oklch(55% 0.17 27);
+ --color-rescript-700: oklch(47% 0.15 27);
+ --color-rescript-800: oklch(39% 0.12 27);
+ --color-rescript-900: oklch(31% 0.09 27);
+ --color-rescript-950: oklch(23% 0.06 27);
+ --font-inter: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+}
diff --git a/templates/rescript-template-vite/tailwind.config.cjs b/templates/rescript-template-vite/tailwind.config.cjs
deleted file mode 100644
index f0376d5..0000000
--- a/templates/rescript-template-vite/tailwind.config.cjs
+++ /dev/null
@@ -1,8 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
- content: ["./index.html", "./src/**/*.res.mjs"],
- theme: {
- extend: {},
- },
- plugins: [],
-};
diff --git a/templates/rescript-template-vite/vite.config.js b/templates/rescript-template-vite/vite.config.js
index 316d9b1..9278745 100644
--- a/templates/rescript-template-vite/vite.config.js
+++ b/templates/rescript-template-vite/vite.config.js
@@ -1,9 +1,11 @@
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
+import tailwindcss from '@tailwindcss/vite';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
+ tailwindcss(),
react({
include: ["**/*.res.mjs"],
}),