diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7b2898b9aa..82c00a24ef 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -17,18 +17,19 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 
 ## [Unreleased]
 
-### Features
-- Add 'poll' and 'to-do-list' icons to Teams theme @natashamayurshah ([#1498](https://github.com/stardust-ui/react/pull/1498))
-
 ### Fixes
 - Fix prop types of `Tooltip` component @kuzhelov ([#1499](https://github.com/stardust-ui/react/pull/1499))
 - Fix `Popup` styling with `pointer` when it is wrapped by `FocusZones` @layershifter ([#1492](https://github.com/stardust-ui/react/pull/1492))
 - Apply custom focus style on `TreeItem` and `TreeTitle` @silviuavram ([#1506](https://github.com/stardust-ui/react/pull/1506))
 
 ### Features
+- Add 'poll' and 'to-do-list' icons to Teams theme @natashamayurshah ([#1498](https://github.com/stardust-ui/react/pull/1498))
 - Add `toolbarBehavior` for `Toolbar` component and apply `buttonBehavior` for `ToolbarItem` component @sophieH29 ([#1468](https://github.com/stardust-ui/react/pull/1468))
 - Integrate ARIA HTML design pattern in the `Tree` component @silviuavram ([#1488](https://github.com/stardust-ui/react/pull/1488))
 
+### Performance
+- Use single Fela renderer for LTR & RTL @layershifter ([#1459](https://github.com/stardust-ui/react/pull/1459))
+
 ### Documentation
 - Add dedicated docs for the `color palette` and `color schema` @mnajdova ([#1494](https://github.com/stardust-ui/react/pull/1494))
 
@@ -41,6 +42,16 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 - Rename types related to accessibility @layershifter ([#1421](https://github.com/stardust-ui/react/pull/1421))
 - Moved the `rtl` and `renderer` props from the `theme` prop object to the `Provider`'s props API @mnajdova ([#1377](https://github.com/stardust-ui/react/pull/1377))
 
+### Fixes
+- Fix click handling on focus for `action` slot in `Attachment` component @Bugaa92 ([#1444](https://github.com/stardust-ui/react/pull/1444))
+- Fix Teams' theme list item end media styles @mnajdova ([#1448](https://github.com/stardust-ui/react/pull/1448))
+- Fix the order of the fela plugin @mnajdova ([#1461](https://github.com/stardust-ui/react/pull/1461))
+- Fix `active` styles for `iconOnly` `MenuItem` in Teams theme @mnajdova ([#1464](https://github.com/stardust-ui/react/pull/1464))
+- Fix keypress/click handling for `Popup` content @kuzhelov ([#1482](https://github.com/stardust-ui/react/pull/1482))
+- Fix `PopupContent` background color in Teams theme @mnajdova ([#1484](https://github.com/stardust-ui/react/pull/1484))
+- Fix merging of item variables in `Menu` and `Toolbar` @miroslavstastny ([#1447](https://github.com/stardust-ui/react/pull/1447))
+- Generate IDs for `header` and `content` slots once in `Dialog` component @layershifter ([#1449](https://github.com/stardust-ui/react/pull/1449))
+
 ### Features
 - Define types for accessibility behaviors props. Do not render `aria-disabled` if the value is `false` @sophieH29 ([#1481](https://github.com/stardust-ui/react/pull/1481))
 - Add `Toolbar` component @miroslavstastny ([#1408](https://github.com/stardust-ui/react/pull/1408))
@@ -55,16 +66,6 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 - Add `Tooltip` component @mnajdova ([#1455](https://github.com/stardust-ui/react/pull/1455))
 - Add 'call-control-release' and 'call-control-request' icon to Teams theme @jay-howe ([#1490](https://github.com/stardust-ui/react/pull/1490))
 
-### Fixes
-- Fix click handling on focus for `action` slot in `Attachment` component @Bugaa92 ([#1444](https://github.com/stardust-ui/react/pull/1444))
-- Fix Teams' theme list item end media styles @mnajdova ([#1448](https://github.com/stardust-ui/react/pull/1448))
-- Fix the order of the fela plugin @mnajdova ([#1461](https://github.com/stardust-ui/react/pull/1461))
-- Fix `active` styles for `iconOnly` `MenuItem` in Teams theme @mnajdova ([#1464](https://github.com/stardust-ui/react/pull/1464))
-- Fix keypress/click handling for `Popup` content @kuzhelov ([#1482](https://github.com/stardust-ui/react/pull/1482))
-- Fix `PopupContent` background color in Teams theme @mnajdova ([#1484](https://github.com/stardust-ui/react/pull/1484))
-- Fix merging of item variables in `Menu` and `Toolbar` @miroslavstastny ([#1447](https://github.com/stardust-ui/react/pull/1447)) 
-- Generate IDs for `header` and `content` slots once in `Dialog` component @layershifter ([#1449](https://github.com/stardust-ui/react/pull/1449))
-
 ### Documentation
 - Remove unfinished themes from the docs themes dropdown on components examples pages @alinais ([#1473](https://github.com/stardust-ui/react/pull/1473))
 - Adding table of contents to FAQ page @hughreeling ([#1291](https://github.com/stardust-ui/react/pull/1291))
diff --git a/packages/react/package.json b/packages/react/package.json
index ffccb44857..2e87eafd61 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -14,16 +14,17 @@
     "css-shorthand-expand": "^1.2.0",
     "downshift": "^3.2.10",
     "fast-memoize": "^2.5.1",
-    "fela": "^10.2.0",
-    "fela-plugin-fallback-value": "^10.2.0",
-    "fela-plugin-placeholder-prefixer": "^10.2.0",
-    "fela-plugin-prefixer": "^10.2.0",
-    "fela-plugin-rtl": "^10.2.0",
+    "fela": "^10.5.0",
+    "fela-plugin-embedded": "^10.5.0",
+    "fela-plugin-fallback-value": "^10.5.0",
+    "fela-plugin-placeholder-prefixer": "^10.5.0",
+    "fela-plugin-prefixer": "^10.5.0",
+    "fela-plugin-rtl": "^10.5.0",
     "keyboard-key": "^1.0.1",
     "lodash": "^4.17.11",
     "popper.js": "^1.15.0",
     "prop-types": "^15.6.1",
-    "react-fela": "^10.2.0",
+    "react-fela": "^10.5.0",
     "react-is": "^16.6.3"
   },
   "devDependencies": {
diff --git a/packages/react/src/components/Provider/Provider.tsx b/packages/react/src/components/Provider/Provider.tsx
index b68dc0a777..511997bca6 100644
--- a/packages/react/src/components/Provider/Provider.tsx
+++ b/packages/react/src/components/Provider/Provider.tsx
@@ -1,5 +1,4 @@
 import { IStyle } from 'fela'
-import { render as felaDomRender } from 'fela-dom'
 import * as _ from 'lodash'
 import * as PropTypes from 'prop-types'
 import * as React from 'react'
@@ -7,12 +6,7 @@ import * as React from 'react'
 import { RendererProvider, ThemeProvider, ThemeContext } from 'react-fela'
 import * as customPropTypes from '@stardust-ui/react-proptypes'
 
-import {
-  felaRenderer as felaLtrRenderer,
-  felaRtlRenderer,
-  isBrowser,
-  ChildrenComponentProps,
-} from '../../lib'
+import { felaRenderer, ChildrenComponentProps } from '../../lib'
 
 import {
   ThemePrepared,
@@ -87,22 +81,7 @@ class Provider extends React.Component<WithAsProp<ProviderProps>> {
 
   staticStylesRendered: boolean = false
 
-  static _topLevelFelaRenderer = undefined
-
-  get topLevelFelaRenderer() {
-    if (!Provider._topLevelFelaRenderer) {
-      Provider._topLevelFelaRenderer = this.props.rtl ? felaRtlRenderer : felaLtrRenderer
-    }
-    return Provider._topLevelFelaRenderer
-  }
-
   renderStaticStyles = (mergedTheme: ThemePrepared) => {
-    // RTL WARNING
-    // This function sets static styles which are global and renderer agnostic.
-    // Top level fela renderer (the first one rendered) is used to render static styles.
-    // With current implementation, static styles cannot differ between LTR and RTL
-    // @see http://fela.js.org/docs/advanced/StaticStyle.html for details
-
     const { siteVariables } = mergedTheme
     const { staticStyles } = this.props.theme
 
@@ -110,13 +89,13 @@ class Provider extends React.Component<WithAsProp<ProviderProps>> {
 
     const renderObject = (object: StaticStyleObject) => {
       _.forEach(object, (style, selector) => {
-        this.topLevelFelaRenderer.renderStatic(style as IStyle, selector)
+        felaRenderer.renderStatic(style as IStyle, selector)
       })
     }
 
     staticStyles.forEach((staticStyle: StaticStyle) => {
       if (typeof staticStyle === 'string') {
-        this.topLevelFelaRenderer.renderStatic(staticStyle)
+        felaRenderer.renderStatic(staticStyle)
       } else if (_.isPlainObject(staticStyle)) {
         renderObject(staticStyle as StaticStyleObject)
       } else if (_.isFunction(staticStyle)) {
@@ -131,12 +110,6 @@ class Provider extends React.Component<WithAsProp<ProviderProps>> {
   }
 
   renderFontFaces = () => {
-    // RTL WARNING
-    // This function sets static styles which are global and renderer agnostic.
-    // Top level fela renderer (the first one rendered) is used to render static styles.
-    // With current implementation, static styles cannot differ between LTR and RTL
-    // @see http://fela.js.org/docs/advanced/StaticStyle.html for details
-
     const { fontFaces } = this.props.theme
 
     if (!fontFaces) return
@@ -145,7 +118,7 @@ class Provider extends React.Component<WithAsProp<ProviderProps>> {
       if (!_.isPlainObject(font)) {
         throw new Error(`fontFaces must be objects, got: ${typeof font}`)
       }
-      this.topLevelFelaRenderer.renderFont(font.name, font.paths, font.style)
+      felaRenderer.renderFont(font.name, font.paths, font.style)
     }
 
     fontFaces.forEach((font: FontFace) => {
@@ -178,10 +151,6 @@ class Provider extends React.Component<WithAsProp<ProviderProps>> {
     // https://github.com/rofrischmann/fela/blob/master/docs/api/fela-dom/rehydrate.md
     const outgoingContext: ProviderContextPrepared = mergeContexts(this.context, inputContext)
 
-    // Heads up!
-    // We should call render() to ensure that a subscription for DOM updates was created
-    // https://github.com/stardust-ui/react/issues/581
-    if (isBrowser()) felaDomRender(outgoingContext.renderer)
     this.renderStaticStylesOnce(outgoingContext.theme)
 
     const rtlProps: { dir?: 'rtl' | 'ltr' } = {}
diff --git a/packages/react/src/lib/felaInvokeKeyframesPlugin.ts b/packages/react/src/lib/felaInvokeKeyframesPlugin.ts
new file mode 100644
index 0000000000..0b4bc9d7f8
--- /dev/null
+++ b/packages/react/src/lib/felaInvokeKeyframesPlugin.ts
@@ -0,0 +1,40 @@
+import callable from './callable'
+
+/**
+ * Fela plugin for invoking keyframes with params. The keyframes, defined in the animationName prop,
+ * are called with the params object, if defined in the animationName prop.
+ *
+ * Caution! Infinite recursion is possible in case if style object has links to self in the props
+ * tree.
+ */
+export default () => {
+  const invokeKeyframes = (styles: Object) => {
+    return Object.keys(styles).reduce((acc, cssPropertyName) => {
+      const cssPropertyValue = styles[cssPropertyName]
+
+      if (cssPropertyName === 'animationName' && typeof cssPropertyValue === 'object') {
+        if (cssPropertyValue.keyframe) {
+          styles[cssPropertyName] = callable(cssPropertyValue.keyframe)(
+            cssPropertyValue.params || {},
+          )
+        }
+
+        return {
+          ...acc,
+          [cssPropertyName]: styles[cssPropertyName],
+        }
+      }
+
+      if (typeof cssPropertyValue === 'object') {
+        return {
+          ...acc,
+          [cssPropertyName]: invokeKeyframes(cssPropertyValue),
+        }
+      }
+
+      return { ...acc, [cssPropertyName]: styles[cssPropertyName] }
+    }, {})
+  }
+
+  return invokeKeyframes
+}
diff --git a/packages/react/src/lib/felaRenderKeyframesPlugin.ts b/packages/react/src/lib/felaRenderKeyframesPlugin.ts
deleted file mode 100644
index aced89be9a..0000000000
--- a/packages/react/src/lib/felaRenderKeyframesPlugin.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-import callable from './callable'
-
-/**
- * Fela plugin for rendering keyframes. The keyframes, defined in the animationName prop, are rendered
- * with the params object, if defined in the animationName prop.
- *
- * Caution! Infinite recursion is possible in case if style object has links to self in the props
- * tree.
- */
-export default () => {
-  const renderKeyframes = (styles: Object, type?, renderer?, props?) => {
-    return Object.keys(styles).reduce((acc, cssPropertyName) => {
-      const cssPropertyValue = styles[cssPropertyName]
-      if (cssPropertyName === 'animationName' && typeof cssPropertyValue === 'object') {
-        if (Array.isArray(cssPropertyValue)) {
-          styles[cssPropertyName] = cssPropertyValue
-            .map(animation => {
-              if (animation.keyframe) {
-                return renderer.renderKeyframe(callable(animation.keyframe), animation.params || {})
-              }
-              return renderer.renderKeyframe(() => animation)
-            }, props)
-            .join(',')
-        } else if (cssPropertyValue.keyframe) {
-          styles[cssPropertyName] = renderer.renderKeyframe(
-            callable(cssPropertyValue.keyframe),
-            cssPropertyValue.params || {},
-          )
-        } else {
-          styles[cssPropertyName] = renderer.renderKeyframe(() => cssPropertyValue)
-        }
-
-        return {
-          ...acc,
-          [cssPropertyName]: styles[cssPropertyName],
-        }
-      }
-      if (typeof cssPropertyValue === 'object') {
-        return {
-          ...acc,
-          [cssPropertyName]: renderKeyframes(cssPropertyValue, type, renderer, props),
-        }
-      }
-      return { ...acc, [cssPropertyName]: styles[cssPropertyName] }
-    }, {})
-  }
-
-  return renderKeyframes
-}
diff --git a/packages/react/src/lib/felaRenderer.tsx b/packages/react/src/lib/felaRenderer.tsx
index fdef508046..ba0a11f11b 100644
--- a/packages/react/src/lib/felaRenderer.tsx
+++ b/packages/react/src/lib/felaRenderer.tsx
@@ -1,14 +1,15 @@
 import { createRenderer } from 'fela'
-import felaSanitizeCss from './felaSanitizeCssPlugin'
-import felaExpandCssShorthandsPlugin from './felaExpandCssShorthandsPlugin'
+import felaPluginEmbedded from 'fela-plugin-embedded'
 import felaPluginFallbackValue from 'fela-plugin-fallback-value'
 import felaPluginPlaceholderPrefixer from 'fela-plugin-placeholder-prefixer'
 import felaPluginPrefixer from 'fela-plugin-prefixer'
-import felaDisableAnimationsPlugin from './felaDisableAnimationsPlugin'
-import rtl from 'fela-plugin-rtl'
+import felaPluginRtl from 'fela-plugin-rtl'
 
 import { Renderer } from '../themes/types'
-import felaRenderKeyframesPlugin from './felaRenderKeyframesPlugin'
+import felaDisableAnimationsPlugin from './felaDisableAnimationsPlugin'
+import felaExpandCssShorthandsPlugin from './felaExpandCssShorthandsPlugin'
+import felaInvokeKeyframesPlugin from './felaInvokeKeyframesPlugin'
+import felaSanitizeCss from './felaSanitizeCssPlugin'
 
 let felaDevMode = false
 
@@ -46,8 +47,10 @@ const blacklistedClassNames = ['fa', 'fas', 'far', 'fal', 'fab']
 const filterClassName = (className: string): boolean =>
   className.indexOf('ad') === -1 && blacklistedClassNames.indexOf(className) === -1
 
-const createRendererConfig = (options: any = {}) => ({
+const rendererConfig = {
   devMode: felaDevMode,
+  filterClassName,
+  enhancers: [],
   plugins: [
     // is necessary to prevent accidental style typos
     // from breaking ALL the styles on the page
@@ -61,22 +64,16 @@ const createRendererConfig = (options: any = {}) => ({
     // Heads up!
     // This is required after fela-plugin-prefixer to resolve the array of fallback values prefixer produces.
     felaPluginFallbackValue(),
+
     felaExpandCssShorthandsPlugin(),
     felaDisableAnimationsPlugin(),
-    felaRenderKeyframesPlugin(),
-    ...(options.isRtl ? [rtl()] : []),
+    felaInvokeKeyframesPlugin(),
+    felaPluginEmbedded(),
+
+    felaPluginRtl(),
   ],
-  filterClassName,
-  enhancers: [],
-  ...(options.isRtl ? { selectorPrefix: 'rtl_' } : {}),
-  ...(options.rendererId ? { rendererId: options.rendererId } : {}),
-})
+}
+
+const felaRenderer: Renderer = createRenderer(rendererConfig)
 
-// TODO: { rendererId: 'default' } is a temporary workaround for https://github.com/stardust-ui/react/issues/948#issuecomment-466404630
-export const felaRenderer: Renderer = createRenderer(
-  createRendererConfig({ rendererId: 'default' }),
-)
-export const felaRtlRenderer: Renderer = createRenderer(
-  createRendererConfig({ isRtl: true, rendererId: 'rtl' }),
-)
 export default felaRenderer
diff --git a/packages/react/src/lib/getClasses.ts b/packages/react/src/lib/getClasses.ts
index 894a65af05..91d81cc20a 100644
--- a/packages/react/src/lib/getClasses.ts
+++ b/packages/react/src/lib/getClasses.ts
@@ -18,8 +18,16 @@ const getClasses = (
   // root, icon, etc.
   const componentParts: string[] = Object.keys(componentStyles)
 
+  // Fela plugins rely on `direction` param in `theme` prop instead of RTL
+  // Our API should be aligned with it
+  const direction = styleParam.rtl ? 'rtl' : 'ltr'
+  const mergedStyleParam = {
+    ...styleParam,
+    theme: { ...styleParam.theme, direction },
+  }
+
   return componentParts.reduce((classes, partName) => {
-    classes[partName] = renderer.renderRule(callable(componentStyles[partName]), styleParam)
+    classes[partName] = renderer.renderRule(callable(componentStyles[partName]), mergedStyleParam)
 
     return classes
   }, {})
diff --git a/packages/react/src/lib/index.ts b/packages/react/src/lib/index.ts
index 56314b89cf..63095471cd 100644
--- a/packages/react/src/lib/index.ts
+++ b/packages/react/src/lib/index.ts
@@ -4,7 +4,7 @@ export { default as applyAccessibilityKeyHandlers } from './applyAccessibilityKe
 export { default as AutoControlledComponent } from './AutoControlledComponent'
 export { default as childrenExist } from './childrenExist'
 export { default as UIComponent } from './UIComponent'
-export { felaRenderer, felaRtlRenderer } from './felaRenderer'
+export { default as felaRenderer } from './felaRenderer'
 export { default as toCompactArray } from './toCompactArray'
 export { default as rtlTextContainer } from './rtlTextContainer'
 export { default as stringLiteralsArray } from './stringLiteralsArray'
diff --git a/packages/react/src/lib/mergeProviderContexts.ts b/packages/react/src/lib/mergeProviderContexts.ts
index dc16784601..6aa79a9e70 100644
--- a/packages/react/src/lib/mergeProviderContexts.ts
+++ b/packages/react/src/lib/mergeProviderContexts.ts
@@ -1,4 +1,4 @@
-import { felaRenderer, felaRtlRenderer } from './felaRenderer'
+import felaRenderer from './felaRenderer'
 import { ProviderContextPrepared, ProviderContextInput } from '../types'
 import mergeThemes from './mergeThemes'
 
@@ -19,7 +19,7 @@ const mergeProviderContexts = (...contexts: ProviderContextInput[]): ProviderCon
       icons: {},
       animations: {},
     },
-    renderer: {},
+    renderer: felaRenderer,
     rtl: false,
     disableAnimations: false,
   } as ProviderContextPrepared
@@ -36,8 +36,8 @@ const mergeProviderContexts = (...contexts: ProviderContextInput[]): ProviderCon
         acc.rtl = mergedRTL
       }
 
-      // Use the correct renderer for RTL
-      acc.renderer = acc.rtl ? felaRtlRenderer : felaRenderer
+      // Use provided renderer if it is defined
+      acc.renderer = next.renderer || acc.renderer
 
       // Latest disableAnimations value wins
       const mergedDisableAnimations = mergeBooleanValues(
diff --git a/packages/react/src/themes/base/components/Loader/loaderStyles.ts b/packages/react/src/themes/base/components/Loader/loaderStyles.ts
index 45fa6cd274..db67ad30fd 100644
--- a/packages/react/src/themes/base/components/Loader/loaderStyles.ts
+++ b/packages/react/src/themes/base/components/Loader/loaderStyles.ts
@@ -2,7 +2,7 @@ import { FlexDirectionProperty } from 'csstype'
 
 import { pxToRem } from '../../../../lib'
 import { LoaderProps } from '../../../../components/Loader/Loader'
-import { ComponentStyleFunctionParam, ICSSInJSStyle } from '../../../types'
+import { ComponentStyleFunctionParam, ICSSInJSStyle, StardustAnimationName } from '../../../types'
 import { ObjectOf } from '../../../../types'
 import { LoaderVariables } from './loaderVariables'
 
@@ -27,16 +27,15 @@ export default {
     theme: t,
     variables: v,
   }: ComponentStyleFunctionParam<LoaderProps, LoaderVariables>): ICSSInJSStyle => {
-    const animationName = {
-      keyframe: ({ from, to }) =>
-        ({
-          from: {
-            transform: `rotate(${from})`,
-          },
-          to: {
-            transform: `rotate(${to}})`,
-          },
-        } as any),
+    const animationName: StardustAnimationName = {
+      keyframe: ({ from, to }) => ({
+        from: {
+          transform: `rotate(${from})`,
+        },
+        to: {
+          transform: `rotate(${to})`,
+        },
+      }),
       params: {
         from: '0deg',
         to: '360deg',
diff --git a/packages/react/src/themes/teams/components/Loader/loaderStyles.ts b/packages/react/src/themes/teams/components/Loader/loaderStyles.ts
index b52c2f22d2..c0e5f7cc82 100644
--- a/packages/react/src/themes/teams/components/Loader/loaderStyles.ts
+++ b/packages/react/src/themes/teams/components/Loader/loaderStyles.ts
@@ -28,12 +28,9 @@ export default {
   }: ComponentStyleFunctionParam<LoaderProps, LoaderVariables>) => {
     const outerAnimation: ICSSInJSStyle = {
       animationName: {
-        keyframe: () =>
-          ({
-            to: {
-              opacity: 1,
-            },
-          } as any),
+        to: {
+          opacity: 1,
+        },
       },
       animationDelay: '1.5s',
       animationDirection: 'normal',
@@ -48,12 +45,9 @@ export default {
     }
     const svgAnimation: ICSSInJSStyle = {
       animationName: {
-        keyframe: () =>
-          ({
-            to: {
-              transform: `translate3d(0, ${v.svgTranslatePosition[p.size]}, 0)`,
-            },
-          } as any),
+        to: {
+          transform: `translate3d(0, ${v.svgTranslatePosition[p.size]}, 0)`,
+        },
       },
       animationDelay: '0s',
       animationDirection: 'normal',
diff --git a/packages/react/src/themes/types.ts b/packages/react/src/themes/types.ts
index daa7cddea5..3ef12f998d 100644
--- a/packages/react/src/themes/types.ts
+++ b/packages/react/src/themes/types.ts
@@ -209,13 +209,15 @@ export interface ICSSPseudoElementStyle extends ICSSInJSStyle {
   content?: string
 }
 
-export interface StardustAnimationName {
-  keyframe?: any
-  params?: object
+type AnimationKeyFrame = Record<'from' | 'to' | string, ICSSInJSStyle>
+
+export interface StardustAnimationName<P = Record<string, any>> {
+  keyframe?: AnimationKeyFrame | ((params: P) => AnimationKeyFrame)
+  params?: P
 }
 
 export type CSSProperties = Omit<React.CSSProperties, 'animationName'> & {
-  animationName?: StardustAnimationName | string | 'none'
+  animationName?: StardustAnimationName | AnimationKeyFrame | string | 'none'
 }
 
 export interface ICSSInJSStyle extends CSSProperties {
diff --git a/packages/react/test/specs/lib/felaInvokeKeyframesPlugin-test.ts b/packages/react/test/specs/lib/felaInvokeKeyframesPlugin-test.ts
new file mode 100644
index 0000000000..29e9399888
--- /dev/null
+++ b/packages/react/test/specs/lib/felaInvokeKeyframesPlugin-test.ts
@@ -0,0 +1,59 @@
+import felaInvokeKeyframesPlugin from 'src/lib/felaInvokeKeyframesPlugin'
+import { felaRenderer } from 'src/lib'
+
+const renderInvokeKeyframes = felaInvokeKeyframesPlugin()
+
+describe('felaRenderKeyframesPlugin', () => {
+  test('does not transform the animationName prop if it is already string', () => {
+    const style = {
+      animationName: 'k1',
+      animationDuration: '2s',
+    }
+
+    expect(renderInvokeKeyframes(style, 'RULE', felaRenderer)).toMatchObject(style)
+  })
+
+  test('does not transform the animationName prop if it is already object', () => {
+    const style = {
+      animationName: { from: { rotate: '0deg' }, to: { rotate: '360deg' } },
+      animationDuration: '2s',
+    }
+
+    expect(renderInvokeKeyframes(style, 'RULE', felaRenderer)).toMatchObject(style)
+  })
+
+  test('transforms the animationName prop if it contains keyframe in the definition', () => {
+    const style = {
+      animationName: {
+        keyframe: () => ({ from: { rotate: '0deg' }, to: { rotate: '360deg' } }),
+      },
+      animationDuration: '2s',
+    }
+
+    expect(renderInvokeKeyframes(style, 'RULE', felaRenderer)).toMatchObject({
+      animationName: expect.objectContaining({
+        from: expect.any(Object),
+        to: expect.any(Object),
+      }),
+      animationDuration: '2s',
+    })
+  })
+
+  test('transforms the animationName prop with params', () => {
+    const style = {
+      animationName: {
+        keyframe: ({ from }) => ({ from: { rotate: from }, to: { rotate: '360deg' } }),
+        params: { from: '100deg' },
+      },
+      animationDuration: '2s',
+    }
+
+    expect(renderInvokeKeyframes(style, 'RULE', felaRenderer)).toMatchObject({
+      animationName: expect.objectContaining({
+        from: { rotate: '100deg' },
+        to: expect.any(Object),
+      }),
+      animationDuration: '2s',
+    })
+  })
+})
diff --git a/packages/react/test/specs/lib/felaRenderKeyframesPlugin-test.ts b/packages/react/test/specs/lib/felaRenderKeyframesPlugin-test.ts
deleted file mode 100644
index dd443ce159..0000000000
--- a/packages/react/test/specs/lib/felaRenderKeyframesPlugin-test.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-import felaRenderKeyframesPlugin from 'src/lib/felaRenderKeyframesPlugin'
-import { felaRenderer } from 'src/lib'
-
-const renderKeyframesPlugin = felaRenderKeyframesPlugin()
-
-describe('felaRenderKeyframesPlugin', () => {
-  test('does not transform the animationName prop if it is already string', () => {
-    const style = {
-      animationName: 'k1',
-      animationDuration: '2s',
-    }
-
-    expect(renderKeyframesPlugin(style, 'RULE', felaRenderer)).toMatchObject(style)
-  })
-
-  test('transforms the animationName prop if it contains keyframe in the definition', () => {
-    const style = {
-      animationName: {
-        keyframe: () => ({ from: { rotate: '0deg' }, to: { rotate: '360deg' } }),
-      },
-      animationDuration: '2s',
-    }
-
-    expect(renderKeyframesPlugin(style, 'RULE', felaRenderer)).toMatchObject({
-      animationName: expect.any(String),
-      animationDuration: '2s',
-    })
-  })
-
-  test('transforms the animationName prop if it contains keyframe in the definition', () => {
-    const style = {
-      animationName: {
-        keyframe: () => ({ from: { rotate: '0deg' }, to: { rotate: '360deg' } }),
-        params: {},
-      },
-      animationDuration: '2s',
-    }
-
-    expect(renderKeyframesPlugin(style, 'RULE', felaRenderer)).toMatchObject({
-      animationName: expect.any(String),
-      animationDuration: '2s',
-    })
-  })
-
-  test('calls the renderer with the keyframe and params object', () => {
-    const params = { from: '0deg', to: '360deg' }
-    const style = {
-      animationName: {
-        keyframe: () => ({ from: { rotate: '0deg' }, to: { rotate: '360deg' } }),
-        params,
-      },
-      animationDuration: '2s',
-    }
-
-    const renderer = { renderKeyframe: jest.fn() }
-    renderKeyframesPlugin(style, 'RULE', renderer)
-    expect(renderer.renderKeyframe).toHaveBeenCalledWith(expect.any(Function), params)
-  })
-})
diff --git a/packages/react/test/specs/lib/mergeProviderContexts/mergeProviderContexts-test.ts b/packages/react/test/specs/lib/mergeProviderContexts/mergeProviderContexts-test.ts
index 0043851392..790fc36d21 100644
--- a/packages/react/test/specs/lib/mergeProviderContexts/mergeProviderContexts-test.ts
+++ b/packages/react/test/specs/lib/mergeProviderContexts/mergeProviderContexts-test.ts
@@ -1,5 +1,4 @@
 import mergeProviderContexts from 'src/lib/mergeProviderContexts'
-import { felaRenderer, felaRtlRenderer } from 'src/lib'
 
 describe('mergeContexts', () => {
   test(`always returns an object`, () => {
@@ -52,15 +51,4 @@ describe('mergeContexts', () => {
     }
     expect(() => mergeProviderContexts(target, source)).not.toThrow()
   })
-
-  describe('renderer', () => {
-    test('felaRtlRenderer is chosen if rtl is true', () => {
-      expect(mergeProviderContexts({ rtl: true })).toHaveProperty('renderer', felaRtlRenderer)
-    })
-    test('felaRenderer is chosen if rtl is not true', () => {
-      expect(mergeProviderContexts({ rtl: false })).toHaveProperty('renderer', felaRenderer)
-      expect(mergeProviderContexts({ rtl: null })).toHaveProperty('renderer', felaRenderer)
-      expect(mergeProviderContexts({ rtl: undefined })).toHaveProperty('renderer', felaRenderer)
-    })
-  })
 })
diff --git a/yarn.lock b/yarn.lock
index 9345c7af60..cad2b2135a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5720,95 +5720,103 @@ fd-slicer@~1.0.1:
   dependencies:
     pend "~1.2.0"
 
-fela-bindings@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-bindings/-/fela-bindings-10.2.0.tgz#4e3d47fec7da0396c616cd3734af3d9f65c481ac"
-  integrity sha512-d8VM7mYHgbJXuT4OjNxMBTVhrLtsT5d1EnmzMnH+XA39xZrBjm155XYoYzPleKHFWt2Gl7q3+3uM/+320kw82g==
+fela-bindings@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-bindings/-/fela-bindings-10.5.0.tgz#b9c18c236333303827aa107db4a6954a1b5044d5"
+  integrity sha512-Shfea8Cp5uIOGaxOcYKMXkQi3t4vjTuMkrQHAesIb57kH8kQjHo17PMinWFd1HrlNIbF1CN/V40htdVHniha+A==
   dependencies:
     fast-loops "^1.0.0"
-    fela-dom "^10.2.0"
-    fela-tools "^10.2.0"
+    fela-dom "^10.5.0"
+    fela-tools "^10.5.0"
     react-addons-shallow-compare "^15.6.2"
     shallow-equal "^1.0.0"
 
-fela-dom@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-dom/-/fela-dom-10.2.0.tgz#7f4b25d1669b56bb1042c6b3ce630d5424ceb5f3"
-  integrity sha512-ethH4ddg1KBMlhHWlzBNSUN5gtdBNt+0ecbMVWU24kc3BxI+fQAKQGVdMf0/T4vNjhnG1qBn/AYyv+tOGH4R6Q==
+fela-dom@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-dom/-/fela-dom-10.5.0.tgz#2f42c962ea1f6123f9a7ae4ec240728506f158ea"
+  integrity sha512-UrECLCy6lnOWxqbO3Z8SdsXd6blu4frKcDujtc9cVUNpvNs89qtxrlj5iyt6qBFDrPCD+R0Ff4m+744Nu52RDQ==
   dependencies:
     css-in-js-utils "^3.0.0"
     fast-loops "^1.0.1"
-    fela-utils "^10.2.0"
+    fela-utils "^10.5.0"
 
-fela-plugin-custom-property@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-plugin-custom-property/-/fela-plugin-custom-property-10.2.0.tgz#ebd95a41e5092eecc3acc95b053e85af06bdb721"
-  integrity sha512-Iw3S6wNj9upWO2yHJnssU70aiGSgtmhPj9ZRU3x7eEfwiK3qihmecM8GzY070mCwj0EWU8Q33AiXY9c4wx8H3w==
+fela-plugin-custom-property@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-plugin-custom-property/-/fela-plugin-custom-property-10.5.0.tgz#cda6c247c1c8cbe0602a1334ff0259a16e8c8f39"
+  integrity sha512-r0LsY/nBTJ8xq82rORaTo0IoxAahX4Pcvm/AV/cbWjfg/i9lVq5MIis2ouD1Zq7ZukaC1OGL9g1Raw43LFqCyQ==
   dependencies:
     css-in-js-utils "^3.0.0"
     isobject "^3.0.1"
 
-fela-plugin-fallback-value@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-plugin-fallback-value/-/fela-plugin-fallback-value-10.2.0.tgz#5e3e41e8938c179ef6cc33026a76c689855c14d2"
-  integrity sha512-zukUFeKFDc5cPP2wZUaMaTK/aTALEI6uwGGGrNfTH3/fuyJ2a8fyv5QjvXVLwNzGvtycuB68Qc2nox5ruNv/GQ==
+fela-plugin-embedded@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-plugin-embedded/-/fela-plugin-embedded-10.5.0.tgz#b97b9e200479dd5907ef208f7ace3896ccc0c8e7"
+  integrity sha512-brYKcwe/AbrtdXyTjP4SJtguryGQTn82hPmOUV1oFgq5np2e55RriFbPUpDETSxI8Kjw2sTgJ3ZHyyoI/tD3nQ==
+  dependencies:
+    fast-loops "^1.0.0"
+    isobject "^3.0.1"
+
+fela-plugin-fallback-value@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-plugin-fallback-value/-/fela-plugin-fallback-value-10.5.0.tgz#829be50180f7d2da8d76cf99811a919a458a22da"
+  integrity sha512-CgirjSPtTvoRxoS3JfTAIKtvlrqe2PzXyELUIQ2V1o2lWVozBJc9lmRC493FPPtyPpgP8Zn311JLxaUC2hOGVQ==
   dependencies:
     css-in-js-utils "^3.0.0"
     isobject "^3.0.1"
 
-fela-plugin-placeholder-prefixer@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-plugin-placeholder-prefixer/-/fela-plugin-placeholder-prefixer-10.2.0.tgz#aaf919b6d7faffa5c62c66ec21f5d6ba8478cde7"
-  integrity sha512-HrnbgeJE6DEkrHSf348t4xGX9DqdLDaDXIEDU/K6tQ49PzZRygPq3OBn6HleNxPcs5HuTCpvuS4lMIe5Qw+I2Q==
+fela-plugin-placeholder-prefixer@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-plugin-placeholder-prefixer/-/fela-plugin-placeholder-prefixer-10.5.0.tgz#561983ab3422228b75e873d237eeaffac8c7523a"
+  integrity sha512-2+DNpapbdjeZsT4oNJvBiM+2AhMG0TNPPvRgsP+c5ZhPZnG+s4P8AjYwAXEu8t/++aVkT/DPdD+9j3gLYSJHIA==
   dependencies:
     fast-loops "^1.0.0"
-    fela-plugin-custom-property "^10.2.0"
+    fela-plugin-custom-property "^10.5.0"
 
-fela-plugin-prefixer@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-plugin-prefixer/-/fela-plugin-prefixer-10.2.0.tgz#962db8ebe9ec51de2f37f30dec14c55ebb72e6be"
-  integrity sha512-7FTzbUkFtdNrzaZtI1Q9uGTlXzmSdOnKiR+bBmG+kbvryJwfvv+AbHUuGLXFoCgXIThMgJAAN6ZP5WsDyIRzhw==
+fela-plugin-prefixer@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-plugin-prefixer/-/fela-plugin-prefixer-10.5.0.tgz#3bf383fa4829bb6afe0d91ca2c16677520571251"
+  integrity sha512-gDGcRaSVndI8tJbnrW95z7Tx+W31MrkYKvot4eUAQ89XiziAFcGgW+39TGeGgPjBbVK6D++xUWePsCKLDPlaTw==
   dependencies:
     css-in-js-utils "^3.0.0"
     fast-loops "^1.0.0"
-    fela-plugin-fallback-value "^10.2.0"
+    fela-plugin-fallback-value "^10.5.0"
     inline-style-prefixer "^5.0.1"
     isobject "^3.0.1"
 
-fela-plugin-rtl@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-plugin-rtl/-/fela-plugin-rtl-10.2.0.tgz#b876c0313e4e9230491276870ec0dba33bf38a2b"
-  integrity sha512-olOJkU5aGUCpGzY3r85ZlUNRwkdWejs5LLYnNbKy6ascYD+xK9aR4JxDgD7rMSQfMAWGZg2yTf+e0hQXU2Lbsw==
+fela-plugin-rtl@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-plugin-rtl/-/fela-plugin-rtl-10.5.0.tgz#a4ccb51e0ce6504fe7ea705b23d89ca7f0423244"
+  integrity sha512-kZWEgZrU8DpV4fA7VnCliEpbO8ag5hj+BPoakSFgHtjSieb/r9iY6B+ZCvz4OLYgU+84X+RonnddAFwukAwk/w==
   dependencies:
     rtl-css-js "^1.1.3"
 
-fela-tools@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-tools/-/fela-tools-10.2.0.tgz#da6a2801b763ebcc0e56ff701fb30aa36b54e9f3"
-  integrity sha512-U1Xp6UEAOMe0LlxD/CgSVPx3VAIWln2oATssUmZ8fJvpI/EvIQyfsa2HPPg74gre/xQ86pV4N7Blqxhz2eB7hA==
+fela-tools@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-tools/-/fela-tools-10.5.0.tgz#cb1cfc27e2e1f8142be4768af45730e9532c4e39"
+  integrity sha512-O7YJVZlvK1r3WcrMAll7X43sVuYK/tXnpXrgSPscjce5I4DS/y2MI8HNFp+Ib7dKm3LDFfXN8TOUiO3ZTXKlIQ==
   dependencies:
     css-in-js-utils "^3.0.0"
     fast-loops "^1.0.0"
-    fela "^10.2.0"
-    fela-utils "^10.2.0"
+    fela "^10.5.0"
+    fela-utils "^10.5.0"
 
-fela-utils@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela-utils/-/fela-utils-10.2.0.tgz#cefc2ec05969445467417325c7e4b2c4da64459e"
-  integrity sha512-XrLrnoM3e4Z2KQMags+9QkAGvyufxood+P9hhpBXh+AkWSsMuV6AhMfcxd1URfaDUNdjMMGG05DqqKIGsq7JeQ==
+fela-utils@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela-utils/-/fela-utils-10.5.0.tgz#29ddce082c52639b6e3789741b187cab0da8d886"
+  integrity sha512-2kH3Om6i/HQ+Ld7WV+fJSN0bMWT9fkndCl1LhcOpsQpqdFqDfVHv5eRrbZKEZ+Fk6Gb4R793/S+w8KIkW7vKZg==
   dependencies:
     css-in-js-utils "^3.0.0"
     fast-loops "^1.0.0"
 
-fela@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/fela/-/fela-10.2.0.tgz#20da3ac0cb68e6a0d3240c0ba2a99b9f0eafd0a7"
-  integrity sha512-FpKtCVRdUPQyTiUStIeH7h3QYWr9TT5C1QAdI3Yn2QhyQMPzsRQhwIFlsHPB2uwWSERAsn6smB5xzo7cBCWlGQ==
+fela@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/fela/-/fela-10.5.0.tgz#32f49e7d680be9d7a20b71f7be900c2122d3c3e2"
+  integrity sha512-lSWkHOEkN5LIbLst/2PT0QK+g5QRsvNey6H89hcmiahaNDkRUxDmjIStfpVL94GfSZYHKyVlicH3DFT9Efne9A==
   dependencies:
     css-in-js-utils "^3.0.0"
     csstype "^2.5.5"
     fast-loops "^1.0.0"
-    fela-utils "^10.2.0"
+    fela-utils "^10.5.0"
     isobject "^3.0.1"
 
 figgy-pudding@^3.4.1, figgy-pudding@^3.5.1:
@@ -11475,13 +11483,13 @@ react-fast-compare@^2.0.4:
   resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9"
   integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==
 
-react-fela@^10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/react-fela/-/react-fela-10.2.0.tgz#dd702239e228847b5ac6504a62fdea8bcd8f9650"
-  integrity sha512-joey+ZnnNbnH/7EGNt++OMTtt62m+3pllXLKDIUAhpJgA/FrGH1G57T7FaQYHaAn71Zw+5KQuV5f/gmme1hIoA==
+react-fela@^10.5.0:
+  version "10.5.0"
+  resolved "https://registry.yarnpkg.com/react-fela/-/react-fela-10.5.0.tgz#0196f138bc1f5478767fa1e5b6f1d2bbd136f38c"
+  integrity sha512-/7AMhuglq5bH7VKNRPGLvG4dV3syoHrBmB7Cp1X0rNnZRhNi1r+iQW8OyN/9pQrkgIetP3RzBKFk9PgxUxO73g==
   dependencies:
-    fela-bindings "^10.2.0"
-    fela-dom "^10.2.0"
+    fela-bindings "^10.5.0"
+    fela-dom "^10.5.0"
     prop-types "^15.5.8"
 
 react-hot-loader@^4.8.2: