diff --git a/package.json b/package.json
index 5d1ad556..f75689c9 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
     "@rollup/plugin-commonjs": "^22.0.0",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.3.0",
+    "@rollup/plugin-replace": "^4.0.0",
     "@rollup/plugin-typescript": "^8.3.2",
     "@types/node": "^16.11.36",
     "@typescript-eslint/eslint-plugin": "^5.43.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 409c7d2f..c3eac27e 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4,6 +4,7 @@ specifiers:
   '@rollup/plugin-commonjs': ^22.0.0
   '@rollup/plugin-json': ^4.1.0
   '@rollup/plugin-node-resolve': ^13.3.0
+  '@rollup/plugin-replace': ^4.0.0
   '@rollup/plugin-typescript': ^8.3.2
   '@types/node': ^16.11.36
   '@typescript-eslint/eslint-plugin': ^5.43.0
@@ -35,6 +36,7 @@ devDependencies:
   '@rollup/plugin-commonjs': 22.0.0_rollup@2.75.0
   '@rollup/plugin-json': 4.1.0_rollup@2.75.0
   '@rollup/plugin-node-resolve': 13.3.0_rollup@2.75.0
+  '@rollup/plugin-replace': 4.0.0_rollup@2.75.0
   '@rollup/plugin-typescript': 8.3.2_yg7irwiyxk6au4j7oxiyr7fshi
   '@types/node': 16.11.36
   '@typescript-eslint/eslint-plugin': 5.43.0_xk6ghhnvmtzaociw4gtdmlcvia
@@ -222,6 +224,16 @@ packages:
       rollup: 2.75.0
     dev: true
 
+  /@rollup/plugin-replace/4.0.0_rollup@2.75.0:
+    resolution: {integrity: sha512-+rumQFiaNac9y64OHtkHGmdjm7us9bo1PlbgQfdihQtuNxzjpaB064HbRnewUOggLQxVCCyINfStkgmBeQpv1g==}
+    peerDependencies:
+      rollup: ^1.20.0 || ^2.0.0
+    dependencies:
+      '@rollup/pluginutils': 3.1.0_rollup@2.75.0
+      magic-string: 0.25.7
+      rollup: 2.75.0
+    dev: true
+
   /@rollup/plugin-typescript/8.3.2_yg7irwiyxk6au4j7oxiyr7fshi:
     resolution: {integrity: sha512-MtgyR5LNHZr3GyN0tM7gNO9D0CS+Y+vflS4v/PHmrX17JCkHUYKvQ5jN5o3cz1YKllM3duXUqu3yOHwMPUxhDg==}
     engines: {node: '>=8.0.0'}
diff --git a/rollup.config.js b/rollup.config.js
index d917f069..5416839c 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -9,6 +9,19 @@ import typescript from "@rollup/plugin-typescript";
 import { name } from "./package.json";
 import { terser } from "rollup-plugin-terser";
 import { defineConfig } from "rollup";
+import { execSync } from "child_process";
+import replace from "@rollup/plugin-replace";
+
+const quoteCommand = command => {
+  return JSON.stringify(execSync(command).toString().trim());
+};
+
+const quoteCommandOrEnv = (command, env) => {
+  if (process.env[env]) {
+    return JSON.stringify(process.env[env]);
+  }
+  return quoteCommand(command);
+};
 
 export default defineConfig({
   input: "src/main.ts",
@@ -29,6 +42,19 @@ export default defineConfig({
       return "window";
   },
   plugins: [
+    replace({
+      values: {
+        __NAME__: JSON.stringify(name.toUpperCase()),
+        __BRANCH__: quoteCommand("git rev-parse --abbrev-ref HEAD"),
+        __COMMIT__: quoteCommandOrEnv("git rev-parse HEAD", "GITHUB_SHA"),
+        __VERSION__: quoteCommand("git describe --tags --dirty --always"),
+        __REPO_URL__: quoteCommand("git remote get-url origin").replace(
+          ".git",
+          ""
+        ),
+        __BUILD_TIME__: JSON.stringify(new Date().toISOString())
+      }
+    }),
     nodeResolve(),
     commonjs(),
     typescript({ include: "src/*.ts" }),
diff --git a/src/main.ts b/src/main.ts
index a98e5cdb..0b8ea8fa 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,6 +1,6 @@
 import { html, LitElement, PropertyValues } from "lit";
 import { customElement, property } from "lit/decorators.js";
-import { styleMap, StyleInfo } from "lit/directives/style-map.js";
+import { StyleInfo, styleMap } from "lit/directives/style-map.js";
 import { handleAction, hasAction } from "./action";
 import { hass } from "card-tools/src/hass";
 import {
@@ -10,7 +10,6 @@ import {
   TEMPLATE_OPTIONS
 } from "./const";
 import { computeStateName, computeTooltip } from "./entity";
-import { name, version } from "../package.json";
 import deepmerge from "deepmerge";
 import { actionHandler } from "./action-handler";
 import "./entity-row";
@@ -33,11 +32,16 @@ import { HassEntity } from "home-assistant-js-websocket";
 import styles from "./styles.css";
 import { arrayToObject } from "./utils";
 
-console.info(
-  `%c ${name.toUpperCase()} %c ${version} `,
+console.groupCollapsed(
+  `%c ${__NAME__} %c ${__VERSION__} `,
   `color: white; background: #039be5; font-weight: 700;`,
   `color: #039be5; background: white; font-weight: 700;`
 );
+console.info(`branch   : ${__BRANCH__}`);
+console.info(`commit   : ${__COMMIT__}`);
+console.info(`built at : ${__BUILD_TIME__}`);
+console.info(__REPO_URL__);
+console.groupEnd();
 
 const computeStateIcon = config => {
   return config.state_icons && config.state_icons[config.state.toLowerCase()];
@@ -52,7 +56,7 @@ const computeStateText = config => {
 
 const migrateIconAlignment = alignment => {
   console.warn(
-    name,
+    __NAME__,
     "'align_icon' and 'align_icons' is deprecated and will be removed in a future version"
   );
   switch (alignment) {
diff --git a/src/types.ts b/src/types.ts
index 56fae191..ddf82b56 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -6,6 +6,13 @@ declare global {
   interface HTMLElementTagNameMap {
     "hui-error-card": LovelaceCard;
   }
+
+  const __NAME__: string;
+  const __BRANCH__: string;
+  const __COMMIT__: string;
+  const __VERSION__: string;
+  const __REPO_URL__: string;
+  const __BUILD_TIME__: string;
 }
 
 export interface TemplateConfig {
@@ -18,9 +25,11 @@ export interface TemplateConfig {
 
 export type Template = string | TemplateConfig;
 
-export type StyleConfig = Record<
-  "button" | "icon" | "name" | "state" | "ripple",
-  Record<string, string | Template>
+export type StyleConfig = Partial<
+  Record<
+    "button" | "icon" | "name" | "state" | "ripple",
+    Record<string, string | Template>
+  >
 >;
 
 export interface ButtonConfig {