@umbra.ui/icons 0.1.0

package/src/icons/AccessibilityIcon.vue

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M9 3.75C9.82843 3.75 10.5 3.07843 10.5 2.25C10.5 1.42157 9.82843 0.75 9 0.75C8.17157 0.75 7.5 1.42157 7.5 2.25C7.5 3.07843 8.17157 3.75 9 3.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9 3.75C9.82843 3.75 10.5 3.07843 10.5 2.25C10.5 1.42157 9.82843 0.75 9 0.75C8.17157 0.75 7.5 1.42157 7.5 2.25C7.5 3.07843 8.17157 3.75 9 3.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7.25 16.5V6.24001" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M10.75 6.24001V16.5" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M2.75 5.75C4.501 6.05 6.61 6.281 9 6.281C10.777 6.281 12.894 6.153 15.25 5.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7.25 11.25H10.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/AlarmClockIcon.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M9 15.25C12.4518 15.25 15.25 12.4518 15.25 9C15.25 5.54822 12.4518 2.75 9 2.75C5.54822 2.75 2.75 5.54822 2.75 9C2.75 12.4518 5.54822 15.25 9 15.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M14.5 1.5L16.5 3.5" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.5 1.5L1.5 3.5" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 15.25C12.4518 15.25 15.25 12.4518 15.25 9C15.25 5.54822 12.4518 2.75 9 2.75C5.54822 2.75 2.75 5.54822 2.75 9C2.75 12.4518 5.54822 15.25 9 15.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M4.581 13.419L2.75 15.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.419 13.419L15.25 15.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 5.75V9L11.75 10.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Align3BottomIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M5.75 2.75H4.25C3.42157 2.75 2.75 3.42157 2.75 4.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H5.75C6.57843 15.25 7.25 14.5784 7.25 13.75V4.25C7.25 3.42157 6.57843 2.75 5.75 2.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.75 8.75H12.25C11.4216 8.75 10.75 9.42157 10.75 10.25V13.75C10.75 14.5784 11.4216 15.25 12.25 15.25H13.75C14.5784 15.25 15.25 14.5784 15.25 13.75V10.25C15.25 9.42157 14.5784 8.75 13.75 8.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5.75 2.75H4.25C3.42157 2.75 2.75 3.42157 2.75 4.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H5.75C6.57843 15.25 7.25 14.5784 7.25 13.75V4.25C7.25 3.42157 6.57843 2.75 5.75 2.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.75 8.75H12.25C11.4216 8.75 10.75 9.42157 10.75 10.25V13.75C10.75 14.5784 11.4216 15.25 12.25 15.25H13.75C14.5784 15.25 15.25 14.5784 15.25 13.75V10.25C15.25 9.42157 14.5784 8.75 13.75 8.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Align3HorizontalIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M2.75 12.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H13.75C14.5784 15.25 15.25 14.5784 15.25 13.75V12.25C15.25 11.4216 14.5784 10.75 13.75 10.75H4.25C3.42157 10.75 2.75 11.4216 2.75 12.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5.75 4.25V5.75C5.75 6.57843 6.42157 7.25 7.25 7.25H10.75C11.5784 7.25 12.25 6.57843 12.25 5.75V4.25C12.25 3.42157 11.5784 2.75 10.75 2.75H7.25C6.42157 2.75 5.75 3.42157 5.75 4.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M2.75 12.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H13.75C14.5784 15.25 15.25 14.5784 15.25 13.75V12.25C15.25 11.4216 14.5784 10.75 13.75 10.75H4.25C3.42157 10.75 2.75 11.4216 2.75 12.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.75 4.25V5.75C5.75 6.57843 6.42157 7.25 7.25 7.25H10.75C11.5784 7.25 12.25 6.57843 12.25 5.75V4.25C12.25 3.42157 11.5784 2.75 10.75 2.75H7.25C6.42157 2.75 5.75 3.42157 5.75 4.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Align3LeftIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M15.25 5.75V4.25C15.25 3.42157 14.5784 2.75 13.75 2.75L4.25 2.75C3.42157 2.75 2.75 3.42157 2.75 4.25V5.75C2.75 6.57843 3.42157 7.25 4.25 7.25L13.75 7.25C14.5784 7.25 15.25 6.57843 15.25 5.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M9.25 13.75V12.25C9.25 11.4216 8.57843 10.75 7.75 10.75H4.25C3.42157 10.75 2.75 11.4216 2.75 12.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H7.75C8.57843 15.25 9.25 14.5784 9.25 13.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M15.25 5.75V4.25C15.25 3.42157 14.5784 2.75 13.75 2.75L4.25 2.75C3.42157 2.75 2.75 3.42157 2.75 4.25V5.75C2.75 6.57843 3.42157 7.25 4.25 7.25L13.75 7.25C14.5784 7.25 15.25 6.57843 15.25 5.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9.25 13.75V12.25C9.25 11.4216 8.57843 10.75 7.75 10.75H4.25C3.42157 10.75 2.75 11.4216 2.75 12.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H7.75C8.57843 15.25 9.25 14.5784 9.25 13.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Align3RightIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M15.25 5.75V4.25C15.25 3.42157 14.5784 2.75 13.75 2.75L4.25 2.75C3.42157 2.75 2.75 3.42157 2.75 4.25V5.75C2.75 6.57843 3.42157 7.25 4.25 7.25L13.75 7.25C14.5784 7.25 15.25 6.57843 15.25 5.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M15.25 13.75V12.25C15.25 11.4216 14.5784 10.75 13.75 10.75H10.25C9.42157 10.75 8.75 11.4216 8.75 12.25V13.75C8.75 14.5784 9.42157 15.25 10.25 15.25H13.75C14.5784 15.25 15.25 14.5784 15.25 13.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M15.25 5.75V4.25C15.25 3.42157 14.5784 2.75 13.75 2.75L4.25 2.75C3.42157 2.75 2.75 3.42157 2.75 4.25V5.75C2.75 6.57843 3.42157 7.25 4.25 7.25L13.75 7.25C14.5784 7.25 15.25 6.57843 15.25 5.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M15.25 13.75V12.25C15.25 11.4216 14.5784 10.75 13.75 10.75H10.25C9.42157 10.75 8.75 11.4216 8.75 12.25V13.75C8.75 14.5784 9.42157 15.25 10.25 15.25H13.75C14.5784 15.25 15.25 14.5784 15.25 13.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Align3TopIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M5.75 2.75H4.25C3.42157 2.75 2.75 3.42157 2.75 4.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H5.75C6.57843 15.25 7.25 14.5784 7.25 13.75V4.25C7.25 3.42157 6.57843 2.75 5.75 2.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.75 2.75H12.25C11.4216 2.75 10.75 3.42157 10.75 4.25V7.75C10.75 8.57843 11.4216 9.25 12.25 9.25H13.75C14.5784 9.25 15.25 8.57843 15.25 7.75V4.25C15.25 3.42157 14.5784 2.75 13.75 2.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5.75 2.75H4.25C3.42157 2.75 2.75 3.42157 2.75 4.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H5.75C6.57843 15.25 7.25 14.5784 7.25 13.75V4.25C7.25 3.42157 6.57843 2.75 5.75 2.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.75 2.75H12.25C11.4216 2.75 10.75 3.42157 10.75 4.25V7.75C10.75 8.57843 11.4216 9.25 12.25 9.25H13.75C14.5784 9.25 15.25 8.57843 15.25 7.75V4.25C15.25 3.42157 14.5784 2.75 13.75 2.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/Align3VerticalIcon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M5.75 2.75H4.25C3.42157 2.75 2.75 3.42157 2.75 4.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H5.75C6.57843 15.25 7.25 14.5784 7.25 13.75V4.25C7.25 3.42157 6.57843 2.75 5.75 2.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M13.75 5.75H12.25C11.4216 5.75 10.75 6.42157 10.75 7.25V10.75C10.75 11.5784 11.4216 12.25 12.25 12.25H13.75C14.5784 12.25 15.25 11.5784 15.25 10.75V7.25C15.25 6.42157 14.5784 5.75 13.75 5.75Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M5.75 2.75H4.25C3.42157 2.75 2.75 3.42157 2.75 4.25V13.75C2.75 14.5784 3.42157 15.25 4.25 15.25H5.75C6.57843 15.25 7.25 14.5784 7.25 13.75V4.25C7.25 3.42157 6.57843 2.75 5.75 2.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M13.75 5.75H12.25C11.4216 5.75 10.75 6.42157 10.75 7.25V10.75C10.75 11.5784 11.4216 12.25 12.25 12.25H13.75C14.5784 12.25 15.25 11.5784 15.25 10.75V7.25C15.25 6.42157 14.5784 5.75 13.75 5.75Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/AnchorIcon.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M9 5.25C9.9665 5.25 10.75 4.4665 10.75 3.5C10.75 2.5335 9.9665 1.75 9 1.75C8.0335 1.75 7.25 2.5335 7.25 3.5C7.25 4.4665 8.0335 5.25 9 5.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M16.25 10.531L15.25 9C15.25 12.452 12.452 15.25 9 15.25C5.548 15.25 2.75 12.452 2.75 9L1.75 10.531" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 5.25V16.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M9 5.25C9.9665 5.25 10.75 4.4665 10.75 3.5C10.75 2.5335 9.9665 1.75 9 1.75C8.0335 1.75 7.25 2.5335 7.25 3.5C7.25 4.4665 8.0335 5.25 9 5.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M7.25 8.25H10.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ArrowDoorInIcon.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M15.544 2.64801L12.223 4.70701C11.929 4.88901 11.75 5.21101 11.75 5.55701V12.444C11.75 12.79 11.929 13.111 12.223 13.294L15.545 15.354" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M7.25 5.75V3.25C7.25 2.698 7.698 2.25 8.25 2.25H14.75C15.302 2.25 15.75 2.698 15.75 3.25V14.75C15.75 15.302 15.302 15.75 14.75 15.75H8.25C7.698 15.75 7.25 15.302 7.25 14.75V12.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M4 11.75L6.75 9L4 6.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M6.75 9H0.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M15.543 2.64801L12.222 4.70701C11.928 4.88901 11.749 5.21101 11.749 5.55701V12.444C11.749 12.79 11.928 13.111 12.222 13.294L15.544 15.354" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ArrowDoorOut3Icon.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M3.45699 2.64801L6.77799 4.70701C7.07199 4.88901 7.25099 5.21101 7.25099 5.55701V12.444C7.25099 12.79 7.07199 13.111 6.77799 13.294L3.45599 15.354" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M11.75 5.75V3.25C11.75 2.698 11.302 2.25 10.75 2.25H4.25C3.698 2.25 3.25 2.698 3.25 3.25V14.75C3.25 15.302 3.698 15.75 4.25 15.75H10.75C11.302 15.75 11.75 15.302 11.75 14.75V12.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M14.5 6.25L17.25 9L14.5 11.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M17.25 9H11.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M3.45699 2.64801L6.77799 4.70701C7.07199 4.88901 7.25099 5.21101 7.25099 5.55701V12.444C7.25099 12.79 7.07199 13.111 6.77799 13.294L3.45599 15.354" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ArrowDottedRotateAnticlockwiseIcon.vue

@@ -0,0 +1,43 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <circle cx="9" cy="9" r="7.25" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M1.87201 3.30499L2.28001 6.24999L5.22401 5.84299" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M16.232 8.484C15.967 4.721 12.831 1.75 8.99998 1.75C5.96898 1.75 3.37298 3.61 2.28998 6.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M14.127 14.877C14.5412 14.877 14.877 14.5412 14.877 14.127C14.877 13.7128 14.5412 13.377 14.127 13.377C13.7128 13.377 13.377 13.7128 13.377 14.127C13.377 14.5412 13.7128 14.877 14.127 14.877Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M9 17C9.41421 17 9.75 16.6642 9.75 16.25C9.75 15.8358 9.41421 15.5 9 15.5C8.58579 15.5 8.25 15.8358 8.25 16.25C8.25 16.6642 8.58579 17 9 17Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M3.87299 14.877C4.2872 14.877 4.62299 14.5412 4.62299 14.127C4.62299 13.7128 4.2872 13.377 3.87299 13.377C3.45877 13.377 3.12299 13.7128 3.12299 14.127C3.12299 14.5412 3.45877 14.877 3.87299 14.877Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M1.75 9.75C2.16421 9.75 2.5 9.41421 2.5 9C2.5 8.58579 2.16421 8.25 1.75 8.25C1.33579 8.25 1 8.58579 1 9C1 9.41421 1.33579 9.75 1.75 9.75Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M15.698 12.524C16.1122 12.524 16.448 12.1882 16.448 11.774C16.448 11.3598 16.1122 11.024 15.698 11.024C15.2838 11.024 14.948 11.3598 14.948 11.774C14.948 12.1882 15.2838 12.524 15.698 12.524Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M11.774 16.448C12.1882 16.448 12.524 16.1122 12.524 15.698C12.524 15.2838 12.1882 14.948 11.774 14.948C11.3598 14.948 11.024 15.2838 11.024 15.698C11.024 16.1122 11.3598 16.448 11.774 16.448Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M6.22601 16.448C6.64023 16.448 6.97601 16.1122 6.97601 15.698C6.97601 15.2838 6.64023 14.948 6.22601 14.948C5.8118 14.948 5.47601 15.2838 5.47601 15.698C5.47601 16.1122 5.8118 16.448 6.22601 16.448Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M2.302 12.524C2.71622 12.524 3.052 12.1882 3.052 11.774C3.052 11.3598 2.71622 11.024 2.302 11.024C1.88779 11.024 1.552 11.3598 1.552 11.774C1.552 12.1882 1.88779 12.524 2.302 12.524Z" :fill="color" data-stroke="none" stroke="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/ArrowTurnLeftIcon.vue

@@ -0,0 +1,34 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <title />
+    <g stroke-linecap="round" stroke-width="1.5" fill="none" :stroke="color" stroke-linejoin="round">
+      <path d="M2.75 9.75H13.25C14.355 9.75 15.25 8.855 15.25 7.75V3.75" />
+      <path d="M7 5.5L2.75 9.75L7 14" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/AspectRatioSquare2Icon.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M4.75 15.25L13.25 15.25C14.3546 15.25 15.25 14.3546 15.25 13.25L15.25 4.75C15.25 3.64543 14.3546 2.75 13.25 2.75L4.75 2.75C3.64543 2.75 2.75 3.64543 2.75 4.75L2.75 13.25C2.75 14.3546 3.64543 15.25 4.75 15.25Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M4.75 15.25L13.25 15.25C14.3546 15.25 15.25 14.3546 15.25 13.25L15.25 4.75C15.25 3.64543 14.3546 2.75 13.25 2.75L4.75 2.75C3.64543 2.75 2.75 3.64543 2.75 4.75L2.75 13.25C2.75 14.3546 3.64543 15.25 4.75 15.25Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M12.75 8.25V5.25H9.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M8.25 12.75H5.25V9.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/AtSignIcon.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path d="M8.875 12C10.4628 12 11.75 10.6009 11.75 8.875C11.75 7.14911 10.4628 5.75 8.875 5.75C7.28718 5.75 6 7.14911 6 8.875C6 10.6009 7.28718 12 8.875 12Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M8.875 12C10.4628 12 11.75 10.6009 11.75 8.875C11.75 7.14911 10.4628 5.75 8.875 5.75C7.28718 5.75 6 7.14911 6 8.875C6 10.6009 7.28718 12 8.875 12Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M11.75 5.75001V10.933C11.75 12.487 14.086 12.755 15.322 10.654C16.37 8.87601 16.113 6.16401 14.804 4.38001C12.878 1.75301 8.42497 0.771007 5.19097 2.94201C2.21797 4.93801 1.15997 8.97501 2.80197 12.238C4.42697 15.467 8.24197 17.032 11.695 15.864" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>

package/src/icons/AwardCertificateIcon.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+interface Props {
+  size?: number | string
+  color?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 24,
+  color: 'currentColor'
+})
+</script>
+
+<template>
+  <svg
+    class="icon"
+    :width="size"
+    :height="size"
+    viewBox="0 0 18 18"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+        <title />
+    <g :fill="color">
+      <path fill-rule="evenodd" clip-rule="evenodd" d="M14.75 7.25647C14.6672 7.25217 14.5839 7.25 14.5 7.25C11.8766 7.25 9.75 9.37665 9.75 12C9.75 13.2382 10.2238 14.3658 11 15.2113V16.25H4.25C3.145 16.25 2.25 15.355 2.25 14.25V3.75C2.25 2.645 3.145 1.75 4.25 1.75H12.75C13.855 1.75 14.75 2.645 14.75 3.75V7V7.25647Z" :fill="color" fill-opacity="0.3" data-color="color-2" data-stroke="none" stroke="none" />
+      <path d="M14.5 14.5C13.678 14.5 12.956 14.098 12.5 13.486V17.5C12.5 17.702 12.622 17.885 12.809 17.962C12.996 18.041 13.21 17.997 13.354 17.854L14.5 16.708L15.646 17.854C15.742 17.95 15.87 18 16 18C16.064 18 16.13 17.988 16.191 17.962C16.378 17.885 16.5 17.702 16.5 17.5V13.486C16.044 14.098 15.322 14.5 14.5 14.5Z" :fill="color" data-stroke="none" stroke="none" />
+      <path d="M10.75 16.25H4.25C3.145 16.25 2.25 15.355 2.25 14.25V3.75C2.25 2.645 3.145 1.75 4.25 1.75H12.75C13.855 1.75 14.75 2.645 14.75 3.75V7" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.25 5.75H11.75" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.25 9H8.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M5.25 12.25H8.25" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+      <path d="M14.5 14.5C15.8807 14.5 17 13.3807 17 12C17 10.6193 15.8807 9.5 14.5 9.5C13.1193 9.5 12 10.6193 12 12C12 13.3807 13.1193 14.5 14.5 14.5Z" :stroke="color" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none" />
+    </g>
+  </svg>
+</template>
+
+<style scoped>
+.icon {
+  display: inline-block;
+  vertical-align: middle;
+}
+</style>