diff --git a/README.md b/README.md
index 33afe5be..cf2e9faf 100644
--- a/README.md
+++ b/README.md
@@ -131,13 +131,13 @@ If you are using [TailwindCSS](https://tailwindcss.com/), import the base CSS fr
 
 ```css
 @import "tailwindcss";
-@import "@firebase-ui/styles/src/base.css";
+@import "@firebase-ui/styles/tailwind";
 ```
 
 If you are not using Tailwind, import the distributable CSS in your project:
 
 ```css
-@import "@firebase-ui/styles/dist.css";
+@import "@firebase-ui/styles";
 ```
 
 To learn more about theming, view the [theming](#theming) section.
diff --git a/packages/styles/README.md b/packages/styles/README.md
index c9f1e37f..6d6a81d4 100644
--- a/packages/styles/README.md
+++ b/packages/styles/README.md
@@ -10,7 +10,7 @@ If you are using Tailwind CSS in your project, you can import the source files d
 
 ```css
 @import "tailwindcss";
-@import "@firebase-ui/styles/src/base.css";
+@import "@firebase-ui/styles/tailwind";
 ```
 
 ### With CSS
@@ -18,7 +18,17 @@ If you are using Tailwind CSS in your project, you can import the source files d
 Alternatively, you can import fully compiled CSS files into your project. This output contains both the tailwind styles and the FirebaseUI styles.
 
 ```jsx
-import "@firebase-ui/styles/dist.css";
+import "@firebase-ui/styles";
+```
+
+## Themes
+
+The packages also exports themes which overrides the CSS variables with preset colors. These can be imported from your CSS:
+
+```css
+@import "tailwindcss";
+@import "@firebase-ui/styles/tailwind";
+@import "@firebase-ui/styles/themes/brualist"
 ```
 
 ## Building
diff --git a/packages/styles/package.json b/packages/styles/package.json
index 9e13e6cf..65440913 100644
--- a/packages/styles/package.json
+++ b/packages/styles/package.json
@@ -7,9 +7,16 @@
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
+      "style": "./dist.css",
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
       "require": "./dist/index.cjs"
+    },
+    "./tailwind": {
+      "style": "./src/base.css"
+    },
+    "./themes/*": {
+      "style": "./src/themes/*.css"
     }
   },
   "files": [