diff --git a/packages/core/src/config.ts b/packages/core/src/config.ts
index 6db70f0ab9..ee6894563c 100644
--- a/packages/core/src/config.ts
+++ b/packages/core/src/config.ts
@@ -3,7 +3,7 @@ import { clone, isStaticRule, mergeDeep, normalizeVariant, toArray, uniq } from
 import { extractorSplit } from './extractors'
 import { DEFAULT_LAYERS } from './constants'
 
-export function resolveShortcuts(shortcuts: UserShortcuts): Shortcut[] {
+export function resolveShortcuts<Theme extends {} = {}>(shortcuts: UserShortcuts<Theme>): Shortcut<Theme>[] {
   return toArray(shortcuts).flatMap((s) => {
     if (Array.isArray(s))
       return [s]
@@ -11,14 +11,14 @@ export function resolveShortcuts(shortcuts: UserShortcuts): Shortcut[] {
   })
 }
 
-export function resolvePreset(preset: Preset): Preset {
+export function resolvePreset<Theme extends {} = {}>(preset: Preset<Theme>): Preset<Theme> {
   const shortcuts = preset.shortcuts
     ? resolveShortcuts(preset.shortcuts)
     : undefined
   preset.shortcuts = shortcuts as any
 
   if (preset.prefix || preset.layer) {
-    const apply = (i: Rule | Shortcut) => {
+    const apply = (i: Rule<Theme> | Shortcut) => {
       if (!i[2])
         i[2] = {}
       const meta = i[2]
@@ -34,11 +34,11 @@ export function resolvePreset(preset: Preset): Preset {
   return preset
 }
 
-export function resolveConfig(
-  userConfig: UserConfig = {},
-  defaults: UserConfigDefaults = {},
-): ResolvedConfig {
-  const config = Object.assign({}, defaults, userConfig) as UserConfigDefaults
+export function resolveConfig<Theme extends {} = {}>(
+  userConfig: UserConfig<Theme> = {},
+  defaults: UserConfigDefaults<Theme> = {},
+): ResolvedConfig<Theme> {
+  const config = Object.assign({}, defaults, userConfig) as UserConfigDefaults<Theme>
   const rawPresets = (config.presets || []).flatMap(toArray).map(resolvePreset)
 
   const sortedPresets = [
@@ -49,7 +49,7 @@ export function resolveConfig(
 
   const layers = Object.assign(DEFAULT_LAYERS, ...rawPresets.map(i => i.layers), userConfig.layers)
 
-  function mergePresets<T extends 'rules' | 'variants' | 'extractors' | 'shortcuts' | 'preflights' | 'preprocess' | 'postprocess' | 'extendTheme' | 'safelist'>(key: T): Required<UserConfig>[T] {
+  function mergePresets<T extends 'rules' | 'variants' | 'extractors' | 'shortcuts' | 'preflights' | 'preprocess' | 'postprocess' | 'extendTheme' | 'safelist'>(key: T): Required<UserConfig<Theme>>[T] {
     return uniq([
       ...sortedPresets.flatMap(p => toArray(p[key] || []) as any[]),
       ...toArray(config[key] || []) as any[],
@@ -62,7 +62,7 @@ export function resolveConfig(
   extractors.sort((a, b) => (a.order || 0) - (b.order || 0))
 
   const rules = mergePresets('rules')
-  const rulesStaticMap: ResolvedConfig['rulesStaticMap'] = {}
+  const rulesStaticMap: ResolvedConfig<Theme>['rulesStaticMap'] = {}
 
   const rulesSize = rules.length
 
@@ -78,12 +78,12 @@ export function resolveConfig(
       return [i, ...rule]
     })
     .filter(Boolean)
-    .reverse() as ResolvedConfig['rulesDynamic']
+    .reverse() as ResolvedConfig<Theme>['rulesDynamic']
 
-  const theme = clone([
+  const theme: Theme = clone([
     ...sortedPresets.map(p => p.theme || {}),
     config.theme || {},
-  ].reduce((a, p) => mergeDeep(a, p), {}))
+  ].reduce<Theme>((a, p) => mergeDeep(a, p), {} as Theme))
 
   ;(mergePresets('extendTheme') as ThemeExtender<any>[]).forEach(extendTheme => extendTheme(theme))
 
diff --git a/packages/core/src/generator/index.ts b/packages/core/src/generator/index.ts
index 071feadd6f..39e901fd8d 100644
--- a/packages/core/src/generator/index.ts
+++ b/packages/core/src/generator/index.ts
@@ -5,25 +5,25 @@ import { CONTROL_SHORTCUT_NO_MERGE, TwoKeyMap, e, entriesToCss, expandVariantGro
 import { version } from '../../package.json'
 import { LAYER_DEFAULT, LAYER_PREFLIGHTS } from '../constants'
 
-export class UnoGenerator {
+export class UnoGenerator<Theme extends {} = {}> {
   public version = version
-  private _cache = new Map<string, StringifiedUtil[] | null>()
-  public config: ResolvedConfig
+  private _cache = new Map<string, StringifiedUtil<Theme>[] | null>()
+  public config: ResolvedConfig<Theme>
   public blocked = new Set<string>()
   public parentOrders = new Map<string, number>()
   public events = createNanoEvents<{
-    config: (config: ResolvedConfig) => void
+    config: (config: ResolvedConfig<Theme>) => void
   }>()
 
   constructor(
-    public userConfig: UserConfig = {},
-    public defaults: UserConfigDefaults = {},
+    public userConfig: UserConfig<Theme> = {},
+    public defaults: UserConfigDefaults<Theme> = {},
   ) {
     this.config = resolveConfig(userConfig, defaults)
     this.events.emit('config', this.config)
   }
 
-  setConfig(userConfig?: UserConfig, defaults?: UserConfigDefaults) {
+  setConfig(userConfig?: UserConfig<Theme>, defaults?: UserConfigDefaults<Theme>) {
     if (!userConfig)
       return
     if (defaults)
@@ -54,8 +54,8 @@ export class UnoGenerator {
     return set
   }
 
-  makeContext(raw: string, applied: VariantMatchedResult) {
-    const context: RuleContext = {
+  makeContext(raw: string, applied: VariantMatchedResult<Theme>) {
+    const context: RuleContext<Theme> = {
       rawSelector: raw,
       currentSelector: applied[1],
       theme: this.config.theme,
@@ -141,7 +141,7 @@ export class UnoGenerator {
 
     const layerSet = new Set<string>([LAYER_DEFAULT])
     const matched = new Set<string>()
-    const sheet = new Map<string, StringifiedUtil[]>()
+    const sheet = new Map<string, StringifiedUtil<Theme>[]>()
     let preflightsMap: Record<string, string> = {}
 
     const tokenPromises = Array.from(tokens).map(async (raw) => {
@@ -170,7 +170,7 @@ export class UnoGenerator {
       if (!preflights)
         return
 
-      const preflightContext: PreflightContext = {
+      const preflightContext: PreflightContext<Theme> = {
         generator: this,
         theme: this.config.theme,
       }
@@ -292,14 +292,14 @@ export class UnoGenerator {
     }
   }
 
-  matchVariants(raw: string, current?: string): VariantMatchedResult {
+  matchVariants(raw: string, current?: string): VariantMatchedResult<Theme> {
     // process variants
-    const variants = new Set<Variant>()
+    const variants = new Set<Variant<Theme>>()
     const handlers: VariantHandler[] = []
     let processed = current || raw
     let applied = false
 
-    const context: VariantContext = {
+    const context: VariantContext<Theme> = {
       rawSelector: raw,
       theme: this.config.theme,
       generator: this,
@@ -382,7 +382,7 @@ export class UnoGenerator {
     return obj
   }
 
-  constructCustomCSS(context: Readonly<RuleContext>, body: CSSObject | CSSEntries, overrideSelector?: string) {
+  constructCustomCSS(context: Readonly<RuleContext<Theme>>, body: CSSObject | CSSEntries, overrideSelector?: string) {
     const normalizedBody = normalizeCSSEntries(body)
     if (isString(normalizedBody))
       return normalizedBody
@@ -394,7 +394,7 @@ export class UnoGenerator {
     return cssBody
   }
 
-  async parseUtil(input: string | VariantMatchedResult, context: RuleContext, internal = false, shortcutPrefix: string | undefined = undefined): Promise<(ParsedUtil | RawUtil)[] | undefined> {
+  async parseUtil(input: string | VariantMatchedResult<Theme>, context: RuleContext<Theme>, internal = false, shortcutPrefix: string | undefined = undefined): Promise<(ParsedUtil | RawUtil)[] | undefined> {
     const [raw, processed, variantHandlers] = isString(input)
       ? this.matchVariants(input)
       : input
@@ -453,7 +453,7 @@ export class UnoGenerator {
         continue
 
       if (this.config.details)
-        context.rules!.push([matcher, handler, meta] as DynamicRule)
+        context.rules!.push([matcher, handler, meta] as DynamicRule<Theme>)
 
       const entries = normalizeCSSValues(result).filter(i => i.length)
       if (entries.length) {
@@ -467,7 +467,7 @@ export class UnoGenerator {
     }
   }
 
-  stringifyUtil(parsed?: ParsedUtil | RawUtil, context?: RuleContext): StringifiedUtil | undefined {
+  stringifyUtil(parsed?: ParsedUtil | RawUtil, context?: RuleContext<Theme>): StringifiedUtil<Theme> | undefined {
     if (!parsed)
       return
     if (isRawUtil(parsed))
@@ -488,12 +488,12 @@ export class UnoGenerator {
     return [parsed[0], selector, body, parent, ruleMeta, this.config.details ? context : undefined, noMerge]
   }
 
-  expandShortcut(input: string, context: RuleContext, depth = 5): [ShortcutValue[], RuleMeta | undefined] | undefined {
+  expandShortcut(input: string, context: RuleContext<Theme>, depth = 5): [ShortcutValue[], RuleMeta | undefined] | undefined {
     if (depth === 0)
       return
 
     const recordShortcut = this.config.details
-      ? (s: Shortcut) => {
+      ? (s: Shortcut<Theme>) => {
           context.shortcuts = context.shortcuts ?? []
           context.shortcuts.push(s)
         }
@@ -554,11 +554,11 @@ export class UnoGenerator {
   }
 
   async stringifyShortcuts(
-    parent: VariantMatchedResult,
-    context: RuleContext,
+    parent: VariantMatchedResult<Theme>,
+    context: RuleContext<Theme>,
     expanded: ShortcutValue[],
     meta: RuleMeta = { layer: this.config.shortcutsLayer },
-  ): Promise<StringifiedUtil[] | undefined> {
+  ): Promise<StringifiedUtil<Theme>[] | undefined> {
     const selectorMap = new TwoKeyMap<string, string | undefined, [[CSSEntries, boolean, number][], number]>()
     const parsed = (
       await Promise.all(uniq(expanded)
@@ -578,7 +578,7 @@ export class UnoGenerator {
       .sort((a, b) => a[0] - b[0])
 
     const [raw, , parentVariants] = parent
-    const rawStringfieldUtil: StringifiedUtil[] = []
+    const rawStringfieldUtil: StringifiedUtil<Theme>[] = []
     for (const item of parsed) {
       if (isRawUtil(item)) {
         rawStringfieldUtil.push([item[0], undefined, item[1], undefined, item[2], context, undefined])
@@ -593,10 +593,10 @@ export class UnoGenerator {
     }
     return rawStringfieldUtil.concat(selectorMap
       .map(([e, index], selector, joinedParents) => {
-        const stringify = (flatten: boolean, noMerge: boolean, entrySortPair: [CSSEntries, number][]): (StringifiedUtil | undefined)[] => {
+        const stringify = (flatten: boolean, noMerge: boolean, entrySortPair: [CSSEntries, number][]): (StringifiedUtil<Theme> | undefined)[] => {
           const maxSort = Math.max(...entrySortPair.map(e => e[1]))
           const entriesList = entrySortPair.map(e => e[0])
-          return (flatten ? [entriesList.flat(1)] : entriesList).map((entries: CSSEntries): StringifiedUtil | undefined => {
+          return (flatten ? [entriesList.flat(1)] : entriesList).map((entries: CSSEntries): StringifiedUtil<Theme> | undefined => {
             const body = entriesToCss(entries)
             if (body)
               return [index, selector, body, joinedParents, { ...meta, noMerge, sort: maxSort }, context, undefined]
@@ -615,7 +615,7 @@ export class UnoGenerator {
         ])
       })
       .flat(2)
-      .filter(Boolean) as StringifiedUtil[])
+      .filter(Boolean) as StringifiedUtil<Theme>[])
   }
 
   isBlocked(raw: string) {
@@ -623,8 +623,8 @@ export class UnoGenerator {
   }
 }
 
-export function createGenerator(config?: UserConfig, defaults?: UserConfigDefaults) {
-  return new UnoGenerator(config, defaults)
+export function createGenerator<Theme extends {} = {}>(config?: UserConfig<Theme>, defaults?: UserConfigDefaults<Theme>) {
+  return new UnoGenerator<Theme>(config, defaults)
 }
 
 export const regexScopePlaceholder = / \$\$ /
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
index e99f719ae0..33087ea014 100644
--- a/packages/core/src/types.ts
+++ b/packages/core/src/types.ts
@@ -64,7 +64,7 @@ export interface RuleContext<Theme extends {} = {}> {
   /**
    * UnoCSS generator instance
    */
-  generator: UnoGenerator
+  generator: UnoGenerator<Theme>
   /**
    * The theme object
    */
@@ -76,7 +76,7 @@ export interface RuleContext<Theme extends {} = {}> {
   /**
    * The result of variant matching.
    */
-  variantMatch: VariantMatchedResult
+  variantMatch: VariantMatchedResult<Theme>
   /**
    * Construct a custom CSS rule.
    * Variants and selector escaping will be handled automatically.
@@ -85,15 +85,15 @@ export interface RuleContext<Theme extends {} = {}> {
   /**
    * Available only when `details` option is enabled.
    */
-  rules?: Rule[]
+  rules?: Rule<Theme>[]
   /**
    * Available only when `details` option is enabled.
    */
-  shortcuts?: Shortcut[]
+  shortcuts?: Shortcut<Theme>[]
   /**
    * Available only when `details` option is enabled.
    */
-  variants?: Variant[]
+  variants?: Variant<Theme>[]
 }
 
 export interface VariantContext<Theme extends {} = {}> {
@@ -104,7 +104,7 @@ export interface VariantContext<Theme extends {} = {}> {
   /**
    * UnoCSS generator instance
    */
-  generator: UnoGenerator
+  generator: UnoGenerator<Theme>
   /**
    * The theme object
    */
@@ -121,7 +121,7 @@ export interface PreflightContext<Theme extends {} = {}> {
   /**
    * UnoCSS generator instance
    */
-  generator: UnoGenerator
+  generator: UnoGenerator<Theme>
   /**
    * The theme object
    */
@@ -616,18 +616,18 @@ export interface PluginOptions {
 export interface UserConfig<Theme extends {} = {}> extends ConfigBase<Theme>, UserOnlyOptions<Theme>, GeneratorOptions, PluginOptions, CliOptions {}
 export interface UserConfigDefaults<Theme extends {} = {}> extends ConfigBase<Theme>, UserOnlyOptions<Theme> {}
 
-export interface ResolvedConfig extends Omit<
-RequiredByKey<UserConfig, 'mergeSelectors' | 'theme' | 'rules' | 'variants' | 'layers' | 'extractors' | 'blocklist' | 'safelist' | 'preflights' | 'sortLayers'>,
+export interface ResolvedConfig<Theme extends {} = {}> extends Omit<
+RequiredByKey<UserConfig<Theme>, 'mergeSelectors' | 'theme' | 'rules' | 'variants' | 'layers' | 'extractors' | 'blocklist' | 'safelist' | 'preflights' | 'sortLayers'>,
 'rules' | 'shortcuts' | 'autocomplete'
 > {
-  presets: Preset[]
-  shortcuts: Shortcut[]
-  variants: VariantObject[]
+  presets: Preset<Theme>[]
+  shortcuts: Shortcut<Theme>[]
+  variants: VariantObject<Theme>[]
   preprocess: Preprocessor[]
   postprocess: Postprocessor[]
   rulesSize: number
-  rulesDynamic: [number, ...DynamicRule][]
-  rulesStaticMap: Record<string, [number, CSSObject | CSSEntries, RuleMeta | undefined, Rule] | undefined>
+  rulesDynamic: [number, ...DynamicRule<Theme>][]
+  rulesStaticMap: Record<string, [number, CSSObject | CSSEntries, RuleMeta | undefined, Rule<Theme>] | undefined>
   autocomplete: {
     templates: (AutoCompleteFunction | AutoCompleteTemplate)[]
     extractors: AutoCompleteExtractor[]
@@ -642,11 +642,11 @@ export interface GenerateResult {
   matched: Set<string>
 }
 
-export type VariantMatchedResult = readonly [
+export type VariantMatchedResult<Theme extends {} = {}> = readonly [
   raw: string,
   current: string,
   variantHandlers: VariantHandler[],
-  variants: Set<Variant>,
+  variants: Set<Variant<Theme>>,
 ]
 
 export type ParsedUtil = readonly [
@@ -663,13 +663,13 @@ export type RawUtil = readonly [
   meta: RuleMeta | undefined,
 ]
 
-export type StringifiedUtil = readonly [
+export type StringifiedUtil<Theme extends {} = {}> = readonly [
   index: number,
   selector: string | undefined,
   body: string,
   parent: string | undefined,
   meta: RuleMeta | undefined,
-  context: RuleContext | undefined,
+  context: RuleContext<Theme> | undefined,
   noMerge: boolean | undefined,
 ]
 
diff --git a/packages/core/src/utils/helpers.ts b/packages/core/src/utils/helpers.ts
index 6e19a76bd0..43d1c2d80a 100644
--- a/packages/core/src/utils/helpers.ts
+++ b/packages/core/src/utils/helpers.ts
@@ -13,7 +13,7 @@ export function isValidSelector(selector = ''): selector is string {
   return validateFilterRE.test(selector)
 }
 
-export function normalizeVariant(variant: Variant): VariantObject {
+export function normalizeVariant(variant: Variant<any>): VariantObject<any> {
   return typeof variant === 'function'
     ? { match: variant }
     : variant
diff --git a/packages/core/src/utils/object.ts b/packages/core/src/utils/object.ts
index 8e8886f4bf..1c3322c1fa 100644
--- a/packages/core/src/utils/object.ts
+++ b/packages/core/src/utils/object.ts
@@ -98,10 +98,10 @@ export function clone<T>(val: T): T {
   return val
 }
 
-export function isStaticRule(rule: Rule): rule is StaticRule {
+export function isStaticRule(rule: Rule<any>): rule is StaticRule {
   return isString(rule[0])
 }
 
-export function isStaticShortcut(sc: Shortcut): sc is StaticShortcut {
+export function isStaticShortcut(sc: Shortcut<any>): sc is StaticShortcut {
   return isString(sc[0])
 }
diff --git a/packages/preset-mini/src/_theme/types.ts b/packages/preset-mini/src/_theme/types.ts
index 5a4677bb21..4627baefe2 100644
--- a/packages/preset-mini/src/_theme/types.ts
+++ b/packages/preset-mini/src/_theme/types.ts
@@ -8,6 +8,10 @@ export interface ThemeAnimation {
   counts?: Record<string, string | number>
 }
 
+export interface Colors {
+  [key: string]: Colors | string
+}
+
 export interface Theme {
   width?: Record<string, string>
   height?: Record<string, string>
@@ -24,9 +28,9 @@ export interface Theme {
   borderRadius?: Record<string, string>
   breakpoints?: Record<string, string>
   verticalBreakpoints?: Record<string, string>
-  colors?: Record<string, string | Record<string, string>>
+  colors?: Colors
   fontFamily?: Record<string, string>
-  fontSize?: Record<string, [string, string]>
+  fontSize?: Record<string, string | [string, string]>
   lineHeight?: Record<string, string>
   letterSpacing?: Record<string, string>
   wordSpacing?: Record<string, string>
diff --git a/packages/preset-typography/src/index.ts b/packages/preset-typography/src/index.ts
index a518d7e144..b793af7f83 100644
--- a/packages/preset-typography/src/index.ts
+++ b/packages/preset-typography/src/index.ts
@@ -79,7 +79,7 @@ export function presetTypography(options?: TypographyOptions): Preset {
       [
         colorsRE,
         ([, color], { theme }: RuleContext<Theme>) => {
-          const baseColor = theme.colors?.[color]
+          const baseColor = theme.colors?.[color] as Record<string, string> | string
           if (baseColor == null)
             return