diff --git a/webapp/components/CategoriesSelect/CategoriesSelect.vue b/webapp/components/CategoriesSelect/CategoriesSelect.vue
index 9ec8688c4..3e240e435 100644
--- a/webapp/components/CategoriesSelect/CategoriesSelect.vue
+++ b/webapp/components/CategoriesSelect/CategoriesSelect.vue
@@ -6,7 +6,7 @@
           <base-button
             :data-test="categoryButtonsId(category.id)"
             @click="toggleCategory(category.id)"
-            :primary="isActive(category.id)"
+            :filled="isActive(category.id)"
             :disabled="isDisabled(category.id)"
             :icon="category.icon"
             size="small"
diff --git a/webapp/components/CommentForm/CommentForm.vue b/webapp/components/CommentForm/CommentForm.vue
index 9227d1e8b..9d4428e2d 100644
--- a/webapp/components/CommentForm/CommentForm.vue
+++ b/webapp/components/CommentForm/CommentForm.vue
@@ -12,7 +12,7 @@
           >
             {{ $t('actions.cancel') }}
           </base-button>
-          <base-button type="submit" :loading="loading" :disabled="disabled || errors" primary>
+          <base-button type="submit" :loading="loading" :disabled="disabled || errors" filled>
             {{ $t('post.comment.submit') }}
           </base-button>
         </div>
diff --git a/webapp/components/ContributionForm/ContributionForm.vue b/webapp/components/ContributionForm/ContributionForm.vue
index 281f40fd5..97fc46e0d 100644
--- a/webapp/components/ContributionForm/ContributionForm.vue
+++ b/webapp/components/ContributionForm/ContributionForm.vue
@@ -82,10 +82,10 @@
         </ds-text>
         <ds-space />
         <div slot="footer" style="text-align: right">
-          <base-button data-test="cancel-button" :disabled="loading" @click="$router.back()">
+          <base-button data-test="cancel-button" :disabled="loading" @click="$router.back()" danger>
             {{ $t('actions.cancel') }}
           </base-button>
-          <base-button type="submit" icon="check" :loading="loading" :disabled="errors" primary>
+          <base-button type="submit" icon="check" :loading="loading" :disabled="errors" filled>
             {{ $t('actions.save') }}
           </base-button>
         </div>
diff --git a/webapp/components/DonationInfo/DonationInfo.vue b/webapp/components/DonationInfo/DonationInfo.vue
index 1bf331b10..e138bef97 100644
--- a/webapp/components/DonationInfo/DonationInfo.vue
+++ b/webapp/components/DonationInfo/DonationInfo.vue
@@ -2,7 +2,7 @@
   <div class="donation-info">
     <progress-bar :title="title" :label="label" :goal="goal" :progress="progress" />
     <a target="_blank" href="https://human-connection.org/spenden/">
-      <base-button primary>{{ $t('donations.donate-now') }}</base-button>
+      <base-button filled>{{ $t('donations.donate-now') }}</base-button>
     </a>
   </div>
 </template>
diff --git a/webapp/components/EnterNonce/EnterNonce.vue b/webapp/components/EnterNonce/EnterNonce.vue
index b44201a42..eb44c3235 100644
--- a/webapp/components/EnterNonce/EnterNonce.vue
+++ b/webapp/components/EnterNonce/EnterNonce.vue
@@ -17,7 +17,7 @@
     <ds-text>
       {{ $t('components.enter-nonce.form.description') }}
     </ds-text>
-    <base-button :disabled="disabled" primary name="submit" type="submit">
+    <base-button :disabled="disabled" filled name="submit" type="submit">
       {{ $t('components.enter-nonce.form.next') }}
     </base-button>
     <slot></slot>
diff --git a/webapp/components/FilterPosts/CategoriesFilterMenuItems.vue b/webapp/components/FilterPosts/CategoriesFilterMenuItems.vue
index 6d91098ad..9189f417d 100644
--- a/webapp/components/FilterPosts/CategoriesFilterMenuItems.vue
+++ b/webapp/components/FilterPosts/CategoriesFilterMenuItems.vue
@@ -16,7 +16,7 @@
               circle
               icon="check"
               @click="resetCategories"
-              :primary="!filteredCategoryIds.length"
+              :filled="!filteredCategoryIds.length"
             />
             <ds-flex-item>
               <label class="category-labels">{{ $t('filter-posts.categories.all') }}</label>
@@ -41,7 +41,7 @@
               <base-button
                 circle
                 :icon="category.icon"
-                :primary="filteredCategoryIds.includes(category.id)"
+                :filled="filteredCategoryIds.includes(category.id)"
                 @click="toggleCategory(category.id)"
               />
               <ds-space margin-bottom="small" />
diff --git a/webapp/components/FilterPosts/FilterPosts.spec.js b/webapp/components/FilterPosts/FilterPosts.spec.js
index b864a8a46..c05a3d85f 100644
--- a/webapp/components/FilterPosts/FilterPosts.spec.js
+++ b/webapp/components/FilterPosts/FilterPosts.spec.js
@@ -92,7 +92,7 @@ describe('FilterPosts.vue', () => {
     it('starts with all categories button active', () => {
       const wrapper = openFilterPosts()
       allCategoriesButton = wrapper.findAll('button').at(1)
-      expect(allCategoriesButton.attributes().class).toContain('--primary')
+      expect(allCategoriesButton.attributes().class).toContain('--filled')
     })
 
     it('calls TOGGLE_CATEGORY when clicked', () => {
@@ -111,27 +111,27 @@ describe('FilterPosts.vue', () => {
       expect(mutations['posts/TOGGLE_LANGUAGE']).toHaveBeenCalledWith({}, 'en')
     })
 
-    it('sets category button attribute `primary` when corresponding category is filtered', () => {
+    it('sets category button attribute `filled` when corresponding category is filtered', () => {
       getters['posts/filteredCategoryIds'] = jest.fn(() => ['cat9'])
       const wrapper = openFilterPosts()
       democracyAndPoliticsButton = wrapper.findAll('button').at(4)
-      expect(democracyAndPoliticsButton.attributes().class).toContain('--primary')
+      expect(democracyAndPoliticsButton.attributes().class).toContain('--filled')
     })
 
-    it('sets language button attribute `primary` when corresponding language is filtered', () => {
+    it('sets language button attribute `filled` when corresponding language is filtered', () => {
       getters['posts/filteredLanguageCodes'] = jest.fn(() => ['es'])
       const wrapper = openFilterPosts()
       spanishButton = wrapper
         .findAll('button.language-buttons')
         .at(languages.findIndex(l => l.code === 'es'))
-      expect(spanishButton.attributes().class).toContain('--primary')
+      expect(spanishButton.attributes().class).toContain('--filled')
     })
 
-    it('sets "filter-by-followed-authors-only" button attribute `primary`', () => {
+    it('sets "filter-by-followed-authors-only" button attribute `filled`', () => {
       getters['posts/filteredByUsersFollowed'] = jest.fn(() => true)
       const wrapper = openFilterPosts()
       expect(
-        wrapper.find('.base-button[name="filter-by-followed-authors-only"]').classes('--primary'),
+        wrapper.find('.base-button[name="filter-by-followed-authors-only"]').classes('--filled'),
       ).toBe(true)
     })
 
diff --git a/webapp/components/FilterPosts/FilterPosts.vue b/webapp/components/FilterPosts/FilterPosts.vue
index 281b46413..787751004 100644
--- a/webapp/components/FilterPosts/FilterPosts.vue
+++ b/webapp/components/FilterPosts/FilterPosts.vue
@@ -3,7 +3,7 @@
     <base-button
       slot="default"
       icon="filter"
-      :primary="filterActive"
+      :filled="filterActive"
       :ghost="!filterActive"
       slot-scope="{ toggleMenu }"
       @click.prevent="toggleMenu()"
diff --git a/webapp/components/FilterPosts/GeneralFilterMenuItems.vue b/webapp/components/FilterPosts/GeneralFilterMenuItems.vue
index c2b7acadd..cf0b4c667 100644
--- a/webapp/components/FilterPosts/GeneralFilterMenuItems.vue
+++ b/webapp/components/FilterPosts/GeneralFilterMenuItems.vue
@@ -18,7 +18,7 @@
                 name="filter-by-followed-authors-only"
                 icon="user-plus"
                 circle
-                :primary="filteredByUsersFollowed"
+                :filled="filteredByUsersFollowed"
                 @click="toggleFilteredByFollowed(user.id)"
                 v-tooltip="{
                   content: this.$t('contribution.filterFollow'),
diff --git a/webapp/components/FilterPosts/LanguageFilterMenuItems.vue b/webapp/components/FilterPosts/LanguageFilterMenuItems.vue
index 25077267b..3427cf176 100644
--- a/webapp/components/FilterPosts/LanguageFilterMenuItems.vue
+++ b/webapp/components/FilterPosts/LanguageFilterMenuItems.vue
@@ -15,7 +15,7 @@
             <base-button
               icon="check"
               circle
-              :primary="!filteredLanguageCodes.length"
+              :filled="!filteredLanguageCodes.length"
               @click="resetLanguages"
             />
             <ds-flex-item>
@@ -36,7 +36,7 @@
             <base-button
               class="language-buttons"
               circle
-              :primary="filteredLanguageCodes.includes(language.code)"
+              :filled="filteredLanguageCodes.includes(language.code)"
               @click="toggleLanguage(language.code)"
             >
               {{ language.code.toUpperCase() }}
diff --git a/webapp/components/FollowButton.vue b/webapp/components/FollowButton.vue
index 14d98ef48..31856e6b4 100644
--- a/webapp/components/FollowButton.vue
+++ b/webapp/components/FollowButton.vue
@@ -4,7 +4,7 @@
     :disabled="disabled || !followId"
     :loading="loading"
     :icon="icon"
-    :primary="isFollowed && !hovered"
+    :filled="isFollowed && !hovered"
     :danger="isFollowed && hovered"
     @mouseenter.native="onHover"
     @mouseleave.native="hovered = false"
diff --git a/webapp/components/LoginForm/LoginForm.vue b/webapp/components/LoginForm/LoginForm.vue
index e1eb0c693..c140edb47 100644
--- a/webapp/components/LoginForm/LoginForm.vue
+++ b/webapp/components/LoginForm/LoginForm.vue
@@ -50,7 +50,7 @@
             <ds-space margin-bottom="large">
               <nuxt-link to="/password-reset/request">{{ $t('login.forgotPassword') }}</nuxt-link>
             </ds-space>
-            <base-button :loading="pending" primary name="submit" type="submit" icon="sign-in">
+            <base-button :loading="pending" filled name="submit" type="submit" icon="sign-in">
               {{ $t('login.login') }}
             </base-button>
             <ds-space margin-top="large" margin-bottom="x-small">
diff --git a/webapp/components/Password/Change.vue b/webapp/components/Password/Change.vue
index 1ce61dcf7..547aab6a1 100644
--- a/webapp/components/Password/Change.vue
+++ b/webapp/components/Password/Change.vue
@@ -24,7 +24,7 @@
       />
       <password-strength :password="formData.password" />
       <ds-space margin-top="base">
-        <base-button :loading="loading" :disabled="errors" primary type="submit">
+        <base-button :loading="loading" :disabled="errors" filled type="submit">
           {{ $t('settings.security.change-password.button') }}
         </base-button>
       </ds-space>
diff --git a/webapp/components/PasswordReset/ChangePassword.vue b/webapp/components/PasswordReset/ChangePassword.vue
index 5661827fa..ab3334c6d 100644
--- a/webapp/components/PasswordReset/ChangePassword.vue
+++ b/webapp/components/PasswordReset/ChangePassword.vue
@@ -24,7 +24,7 @@
         />
         <password-strength :password="formData.password" />
         <ds-space margin-top="base" margin-bottom="xxx-small">
-          <base-button :loading="$apollo.loading" :disabled="errors" primary type="submit">
+          <base-button :loading="$apollo.loading" :disabled="errors" filled type="submit">
             {{ $t('settings.security.change-password.button') }}
           </base-button>
         </ds-space>
diff --git a/webapp/components/PasswordReset/Request.vue b/webapp/components/PasswordReset/Request.vue
index e5c4aabac..5f4baf357 100644
--- a/webapp/components/PasswordReset/Request.vue
+++ b/webapp/components/PasswordReset/Request.vue
@@ -23,7 +23,7 @@
     <base-button
       :disabled="disabled"
       :loading="$apollo.loading"
-      primary
+      filled
       name="submit"
       type="submit"
       icon="envelope"
diff --git a/webapp/components/Registration/CreateUserAccount.vue b/webapp/components/Registration/CreateUserAccount.vue
index 5c7276ff0..50967d240 100644
--- a/webapp/components/Registration/CreateUserAccount.vue
+++ b/webapp/components/Registration/CreateUserAccount.vue
@@ -106,6 +106,7 @@
           style="float: right;"
           icon="check"
           type="submit"
+          filled
           :loading="$apollo.loading"
           :disabled="
             errors ||
@@ -115,7 +116,6 @@
               !noCommercial ||
               !noPolitical
           "
-          primary
         >
           {{ $t('actions.save') }}
         </base-button>
diff --git a/webapp/components/Registration/Signup.vue b/webapp/components/Registration/Signup.vue
index 67cd09f92..8a9447a69 100644
--- a/webapp/components/Registration/Signup.vue
+++ b/webapp/components/Registration/Signup.vue
@@ -33,7 +33,7 @@
       <base-button
         :disabled="disabled"
         :loading="$apollo.loading"
-        primary
+        filled
         name="submit"
         type="submit"
         icon="envelope"
diff --git a/webapp/components/ShoutButton.vue b/webapp/components/ShoutButton.vue
index e2255375d..3e5ecec38 100644
--- a/webapp/components/ShoutButton.vue
+++ b/webapp/components/ShoutButton.vue
@@ -3,7 +3,7 @@
     <base-button
       :loading="loading"
       :disabled="disabled"
-      :primary="shouted"
+      :filled="shouted"
       icon="bullhorn"
       circle
       @click="toggle"
diff --git a/webapp/components/TeaserImage/TeaserImage.vue b/webapp/components/TeaserImage/TeaserImage.vue
index e5acef603..a68c427a6 100644
--- a/webapp/components/TeaserImage/TeaserImage.vue
+++ b/webapp/components/TeaserImage/TeaserImage.vue
@@ -9,7 +9,7 @@
     @vdropzone-thumbnail="transformImage"
   >
     <div class="crop-overlay" ref="cropperOverlay" v-show="showCropper">
-      <base-button @click="cropImage" class="crop-confirm" primary>
+      <base-button @click="cropImage" class="crop-confirm" filled>
         {{ $t('contribution.teaserImage.cropperConfirm') }}
       </base-button>
       <base-button
diff --git a/webapp/pages/admin/donations.vue b/webapp/pages/admin/donations.vue
index b2a28134b..f40cb4c7d 100644
--- a/webapp/pages/admin/donations.vue
+++ b/webapp/pages/admin/donations.vue
@@ -8,7 +8,7 @@
         placeholder="1200"
         icon="money"
       />
-      <base-button primary type="submit" :disabled="!formData.goal || !formData.progress">
+      <base-button filled type="submit" :disabled="!formData.goal || !formData.progress">
         {{ $t('actions.save') }}
       </base-button>
     </ds-form>
diff --git a/webapp/pages/admin/users.vue b/webapp/pages/admin/users.vue
index 8b8f4ef31..e56be70ab 100644
--- a/webapp/pages/admin/users.vue
+++ b/webapp/pages/admin/users.vue
@@ -12,7 +12,7 @@
               />
             </ds-flex-item>
             <ds-flex-item width="30px">
-              <base-button primary circle type="submit" icon="search" :loading="$apollo.loading" />
+              <base-button filled circle type="submit" icon="search" :loading="$apollo.loading" />
             </ds-flex-item>
           </ds-flex>
         </ds-form>
diff --git a/webapp/pages/index.vue b/webapp/pages/index.vue
index f9223a01b..58de701cf 100644
--- a/webapp/pages/index.vue
+++ b/webapp/pages/index.vue
@@ -8,7 +8,7 @@
         <!--<donation-info /> -->
         <div>
           <a target="_blank" href="https://human-connection.org/spenden/">
-            <base-button primary>{{ $t('donations.donate-now') }}</base-button>
+            <base-button filled>{{ $t('donations.donate-now') }}</base-button>
           </a>
         </div>
         <div class="sorting-dropdown">
@@ -49,7 +49,7 @@
           }"
           class="post-add-button"
           icon="plus"
-          primary
+          filled
           circle
         />
       </nuxt-link>
diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index 5a504fdcc..1e2ad3834 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -227,7 +227,7 @@
                   class="profile-post-add-button"
                   icon="plus"
                   circle
-                  primary
+                  filled
                 />
               </nuxt-link>
             </ds-space>
diff --git a/webapp/pages/settings/embeds.vue b/webapp/pages/settings/embeds.vue
index b417dc017..22050c636 100644
--- a/webapp/pages/settings/embeds.vue
+++ b/webapp/pages/settings/embeds.vue
@@ -16,10 +16,10 @@
       <ds-text>
         {{ $t('settings.embeds.status.change.question') }}
       </ds-text>
-      <base-button @click="submit" :primary="!disabled" :disabled="!disabled">
+      <base-button @click="submit" :filled="!disabled" :disabled="!disabled">
         {{ $t('settings.embeds.status.change.deny') }}
       </base-button>
-      <base-button @click="submit" :primary="disabled" :disabled="disabled">
+      <base-button @click="submit" :filled="disabled" :disabled="disabled">
         {{ $t('settings.embeds.status.change.allow') }}
       </base-button>
 
diff --git a/webapp/pages/settings/index.vue b/webapp/pages/settings/index.vue
index 0f641c6f9..20034d5af 100644
--- a/webapp/pages/settings/index.vue
+++ b/webapp/pages/settings/index.vue
@@ -31,7 +31,7 @@
           :placeholder="$t('settings.data.labelBio')"
         />
         <template slot="footer">
-          <base-button icon="check" :disabled="errors" type="submit" :loading="loadingData" primary>
+          <base-button icon="check" :disabled="errors" type="submit" :loading="loadingData" filled>
             {{ $t('actions.save') }}
           </base-button>
         </template>
diff --git a/webapp/pages/settings/my-email-address/enter-nonce.vue b/webapp/pages/settings/my-email-address/enter-nonce.vue
index b9fd1a291..91b2e269f 100644
--- a/webapp/pages/settings/my-email-address/enter-nonce.vue
+++ b/webapp/pages/settings/my-email-address/enter-nonce.vue
@@ -17,7 +17,7 @@
         />
 
         <template slot="footer">
-          <base-button class="submit-button" icon="check" :disabled="errors" type="submit" primary>
+          <base-button class="submit-button" icon="check" :disabled="errors" type="submit" filled>
             {{ $t('actions.save') }}
           </base-button>
         </template>
diff --git a/webapp/pages/settings/my-email-address/index.vue b/webapp/pages/settings/my-email-address/index.vue
index 58cdc7124..4e01bbb44 100644
--- a/webapp/pages/settings/my-email-address/index.vue
+++ b/webapp/pages/settings/my-email-address/index.vue
@@ -19,7 +19,7 @@
           <ds-space class="backendErrors" v-if="backendErrors">
             <ds-text align="center" bold color="danger">{{ backendErrors.message }}</ds-text>
           </ds-space>
-          <base-button icon="check" :disabled="errors" type="submit" primary>
+          <base-button icon="check" :disabled="errors" type="submit" filled>
             {{ $t('actions.save') }}
           </base-button>
         </template>
diff --git a/webapp/pages/settings/my-social-media.vue b/webapp/pages/settings/my-social-media.vue
index d89896cb8..5f489c303 100644
--- a/webapp/pages/settings/my-social-media.vue
+++ b/webapp/pages/settings/my-social-media.vue
@@ -54,7 +54,7 @@
           :placeholder="$t('settings.social-media.placeholder')"
         />
         <ds-space margin-top="base">
-          <base-button primary :disabled="disabled" type="submit">
+          <base-button filled :disabled="disabled" type="submit">
             {{ editingLink.id ? $t('actions.save') : $t('settings.social-media.submit') }}
           </base-button>
           <base-button v-if="editingLink.id" id="cancel" ghost @click="handleCancel()">
diff --git a/webapp/pages/settings/privacy.vue b/webapp/pages/settings/privacy.vue
index e1d440b05..f759926b7 100644
--- a/webapp/pages/settings/privacy.vue
+++ b/webapp/pages/settings/privacy.vue
@@ -4,7 +4,7 @@
       <input id="allow-shouts" type="checkbox" v-model="shoutsAllowed" />
       <label for="allow-shouts">{{ $t('settings.privacy.make-shouts-public') }}</label>
     </ds-space>
-    <base-button primary @click="submit" :disabled="disabled">{{ $t('actions.save') }}</base-button>
+    <base-button filled @click="submit" :disabled="disabled">{{ $t('actions.save') }}</base-button>
   </ds-card>
 </template>
 
diff --git a/webapp/pages/terms-and-conditions-confirm.vue b/webapp/pages/terms-and-conditions-confirm.vue
index 38fadbdf8..0716048b5 100644
--- a/webapp/pages/terms-and-conditions-confirm.vue
+++ b/webapp/pages/terms-and-conditions-confirm.vue
@@ -17,7 +17,7 @@
       </ds-text>
 
       <template slot="footer">
-        <base-button primary @click="submit" :disabled="!checked">
+        <base-button filled @click="submit" :disabled="!checked">
           {{ $t(`actions.save`) }}
         </base-button>
       </template>