diff --git a/apps/demo/src/Views/Ui/components/CountryDisplay/CountryDisplayDemo.tsx b/apps/demo/src/Views/Ui/components/CountryDisplay/CountryDisplayDemo.tsx
index 0d5e64c99..f9b9fa736 100644
--- a/apps/demo/src/Views/Ui/components/CountryDisplay/CountryDisplayDemo.tsx
+++ b/apps/demo/src/Views/Ui/components/CountryDisplay/CountryDisplayDemo.tsx
@@ -9,6 +9,8 @@ import nepaliData from "../FormWidgets/np.json";
 import "../../../../assets/css/country.css";
 
 export const CountryDisplayDemo = () => {
+  import("@prefabs.tech/react-ui/dist/PrefabsTechFlagIcon.css");
+
   const [t] = useTranslation("ui");
   const navigate = useNavigate();
   const selectedLocale = i18n.language;
diff --git a/apps/demo/src/Views/Ui/components/FormWidgets/CountryPicker.tsx b/apps/demo/src/Views/Ui/components/FormWidgets/CountryPicker.tsx
index d2a81d370..9b544bcf0 100644
--- a/apps/demo/src/Views/Ui/components/FormWidgets/CountryPicker.tsx
+++ b/apps/demo/src/Views/Ui/components/FormWidgets/CountryPicker.tsx
@@ -14,6 +14,8 @@ import nepaliData from "./np.json";
 import { CodeBlock, Section } from "../../../../components/Demo";
 
 export const CountryPickerDemo = () => {
+  import("@prefabs.tech/react-ui/dist/PrefabsTechFlagIcon.css");
+
   const [t, i18n] = useTranslation("ui");
   const navigate = useNavigate();
   const locale = i18n.language;
diff --git a/packages/ui/package.json b/packages/ui/package.json
index a0e668c46..50711dab4 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -8,6 +8,7 @@
       "import": "./dist/PrefabsTechReactUI.es.js",
       "require": "./dist/PrefabsTechReactUI.umd.js"
     },
+    "./dist/PrefabsTechFlagIcon.css": "./dist/flag-icon.css",
     "./dist/PrefabsTechReactUI.css": "./dist/react-ui.css"
   },
   "main": "./dist/PrefabsTechReactUI.umd.js",
diff --git a/packages/ui/src/CountryDisplay/index.tsx b/packages/ui/src/CountryDisplay/index.tsx
index 8d3c6f546..0b99e0d79 100644
--- a/packages/ui/src/CountryDisplay/index.tsx
+++ b/packages/ui/src/CountryDisplay/index.tsx
@@ -6,6 +6,8 @@ import type { Locales } from "../types";
 
 import "../assets/css/country-display.css";
 
+import("@dzangolab/flag-icon-css/css/flag-icon.min.css");
+
 interface CountryDisplayProperties {
   className?: string;
   code: string;
diff --git a/packages/ui/src/FormWidgets/CountryPicker/index.tsx b/packages/ui/src/FormWidgets/CountryPicker/index.tsx
index fa8c9ace5..047fbbc77 100644
--- a/packages/ui/src/FormWidgets/CountryPicker/index.tsx
+++ b/packages/ui/src/FormWidgets/CountryPicker/index.tsx
@@ -16,6 +16,8 @@ import type {
 } from "../../types/country-picker";
 import type { GroupedOption as OptionGroup, Option } from "../Select";
 
+import("@dzangolab/flag-icon-css/css/flag-icon.min.css");
+
 const getFavoriteOptions = <T,>(
   favorites: string[],
   locale: string,
diff --git a/packages/ui/src/assets/css/form-widgets/index.css b/packages/ui/src/assets/css/form-widgets/index.css
index 4b31a18e6..e7ecc2546 100644
--- a/packages/ui/src/assets/css/form-widgets/index.css
+++ b/packages/ui/src/assets/css/form-widgets/index.css
@@ -1,5 +1,3 @@
-@import "@dzangolab/flag-icon-css/css/flag-icon.min.css";
-
 @import "./field.css";
 
 @import "./checkbox-input.css";
diff --git a/packages/ui/src/react-env.d.ts b/packages/ui/src/react-env.d.ts
index dd4ab7e91..45b093962 100644
--- a/packages/ui/src/react-env.d.ts
+++ b/packages/ui/src/react-env.d.ts
@@ -1 +1,2 @@
+declare module "*.css";
 declare module "*.svg";
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 47dc567ef..417458ed9 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -12,6 +12,7 @@ export default defineConfig(({ mode }) => {
 
   return {
     build: {
+      cssCodeSplit: true,
       lib: {
         entry: resolve(dirname(fileURLToPath(import.meta.url)), "src/index.ts"),
         fileName: (format) => `PrefabsTechReactUI.${format}.js`,
@@ -23,6 +24,13 @@ export default defineConfig(({ mode }) => {
           ...Object.keys(dependencies),
         ],
         output: {
+          assetFileNames: (assetInfo) => {
+            if (assetInfo.names?.includes("index.css")) {
+              return "react-ui.css";
+            }
+
+            return assetInfo.names?.[0];
+          },
           exports: "named",
           globals: {
             react: "React",