diff --git a/tests/unit/components/Profile/SelectColorSchemeCard.spec.ts b/tests/unit/components/Profile/SelectColorSchemeCard.spec.ts
new file mode 100644
index 0000000..3ab8e29
--- /dev/null
+++ b/tests/unit/components/Profile/SelectColorSchemeCard.spec.ts
@@ -0,0 +1,45 @@
+import SelectColorSchemeCard from '@/components/Profile/SelectColorSchemeCard.vue'
+
+import { shallowMount } from '@vue/test-utils'
+import Canvg from 'canvg'
+import { mockColorScheme1 } from '../../__mocks__/userColorScheme.mock'
+
+Canvg.fromString = jest.fn().mockReturnValue({
+  start: jest.fn(),
+  stop: jest.fn()
+})
+
+HTMLCanvasElement.prototype.getContext = jest.fn()
+
+describe('Select color scheme card', () => {
+  let wrapper
+
+  const createComponent = ({ propsData = {}, provide = {} } = {}) => {
+    wrapper = shallowMount(SelectColorSchemeCard, {
+      propsData: {
+        ...propsData
+      },
+      provide: {
+        ...provide
+      }
+    })
+  }
+
+  it('sets selected class', async () => {
+    createComponent({ propsData: { isSelected: false, colorScheme: mockColorScheme1 } })
+
+    expect(wrapper.element.classList.value.includes('--select')).toBe(false)
+
+    await wrapper.setProps({ isSelected: true })
+
+    expect(wrapper.element.classList.value.includes('--select')).toBe(true)
+  })
+
+  it('emits select', async () => {
+    createComponent({ propsData: { isSelected: true, colorScheme: mockColorScheme1 } })
+
+    await wrapper.trigger('click')
+
+    expect(wrapper.emitted().select).toBeTruthy()
+  })
+})
diff --git a/tests/unit/setup.ts b/tests/unit/setup.ts
index e50afcb..f6bc701 100644
--- a/tests/unit/setup.ts
+++ b/tests/unit/setup.ts
@@ -1,2 +1,9 @@
+import Vue from 'vue'
+import UI from '@/components/UI'
+import { enableAutoDestroy } from '@vue/test-utils'
+
 process.env.VUE_APP_HOME_URL = 'http://localhost'
 process.env.VUE_APP_KEYS_URL = 'http://keys.localhost'
+
+Vue.use(UI)
+enableAutoDestroy(global.afterEach)