diff --git a/shimatta_kenkyusho/parts/urls.py b/shimatta_kenkyusho/parts/urls.py
index a693f79..c8f2f39 100644
--- a/shimatta_kenkyusho/parts/urls.py
+++ b/shimatta_kenkyusho/parts/urls.py
@@ -4,6 +4,7 @@ from . import views as parts_views
 urlpatterns = [
     path('', parts_views.MainView.as_view(), name='parts-main'),
     path('components/', parts_views.ComponentView.as_view(), name='parts-components'),
+    path('componenttypes/', parts_views.ComponentTypeView.as_view(), name='parts-componenttypes'),
     path('packages/', parts_views.PackageView.as_view(), name='parts-packages'),
     path('distributors/', parts_views.DistributorView.as_view(), name='parts-distributors'),
     path('stocks/', parts_views.StockView.as_view(), name='parts-stocks'),
@@ -16,4 +17,5 @@ urlpatterns = [
     path('distributors/<slug:uuid>/', parts_views.DistributorDetailView.as_view(), name='parts-distributors-detail'),
     path('manufacturers/', parts_views.ManufacturersViewSet.as_view(), name='parts-manufacturers'),
     path("manufacturers/<slug:uuid>/", parts_views.ManufacturerDetailViewSet.as_view(), name='parts-manufacturers-detail'),
+    path("componenttypes/<slug:uuid>/", parts_views.ComponentTypeDetailView.as_view(), name='parts-componenttypes-detail'),    
 ]
diff --git a/shimatta_kenkyusho/parts/views.py b/shimatta_kenkyusho/parts/views.py
index 3da80e8..df15c71 100644
--- a/shimatta_kenkyusho/parts/views.py
+++ b/shimatta_kenkyusho/parts/views.py
@@ -11,7 +11,9 @@ from django.views import View
 import django.forms as forms
 from django.views.generic import TemplateView, DetailView
 from django.contrib.auth.mixins import LoginRequiredMixin, PermissionRequiredMixin
-from .models import Storage, Stock, Component, Distributor, Manufacturer, Package, ComponentParameter, ComponentParameterType, DistributorNum, PackageParameter
+from .models import Storage, Stock, Component, Distributor, Manufacturer, Package
+from .models import ComponentParameter, ComponentParameterType, DistributorNum, PackageParameter
+from .models import ComponentType
 from .qr_parser import QrCodeValidator
 from django.core.paginator import Paginator
 from django.core.exceptions import ValidationError
@@ -143,6 +145,52 @@ def login_view(request):
 
 # Create your views here.
 
+class ComponentTypeView(LoginRequiredMixin, BaseTemplateMixin, TemplateView):
+    template_name = 'parts/component-types.html'
+    base_title = 'Component Types'
+    default_page_size = 25
+
+    def filter_queryset(self, queryset, search_string):
+        if search_string is None or search_string == '':
+            return queryset
+
+        search_fragments = search_string.strip().split()
+        for search in search_fragments:
+            queryset = queryset.filter(Q(class_name__icontains = search))
+
+        return queryset
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        search = self.request.GET.get('search', default=None)
+        page_num = self.request.GET.get('page', default=1)
+
+        context['search_string'] = search
+
+        queryset = ComponentType.objects.all() 
+        types = self.filter_queryset(queryset, search)
+        
+        comptypes = Paginator(types, self.default_page_size)
+        
+
+        context['comptypes'] = comptypes.get_page(page_num)
+        return context
+    
+
+    def post(self, request, *args, **kwargs):
+        return super().post(request, *args, **kwargs)
+
+class ComponentTypeDetailView(LoginRequiredMixin, BaseTemplateMixin, DetailView):
+    model = ComponentType
+    base_title = ''
+    pk_url_kwarg = 'uuid'
+    template_name = 'parts/component-types-detail.html'
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        return context
+    
+
 class ComponentView(LoginRequiredMixin, BaseTemplateMixin, TemplateView):
     template_name = 'parts/components.html'
     base_title = 'Components'
diff --git a/shimatta_kenkyusho/templates/parts/component-types-detail.html b/shimatta_kenkyusho/templates/parts/component-types-detail.html
new file mode 100644
index 0000000..0bbbdcd
--- /dev/null
+++ b/shimatta_kenkyusho/templates/parts/component-types-detail.html
@@ -0,0 +1,19 @@
+{% extends 'base.html' %}
+{% load crispy_forms_tags %}
+
+{% block content %}
+<div class="container">
+    <div class="row">
+        <div class="col-md">
+            <h2>Component Type: {{object.class_name}}</h2>
+            
+        </div>
+    </div>
+</div>
+
+{% endblock content %}
+{% block custom_scripts %}
+
+<script type="text/javascript">
+</script>
+{% endblock custom_scripts %}
\ No newline at end of file
diff --git a/shimatta_kenkyusho/templates/parts/component-types.html b/shimatta_kenkyusho/templates/parts/component-types.html
new file mode 100644
index 0000000..d8010c3
--- /dev/null
+++ b/shimatta_kenkyusho/templates/parts/component-types.html
@@ -0,0 +1,46 @@
+{% extends 'base.html' %}
+{% load crispy_forms_tags %}
+
+{% block content %}
+<div class="container">
+    <div class="row">
+        <div class="col-md">
+            <h2>Component Types</h2>
+            <form action="" method="get">
+                <div class="input-group mb-3">
+                    <input class="form-control" name="search" type="search" placeholder="Search Component Type..." {% if search_string %}value="{{search_string}}"{% endif %}>
+                    <button type="submit" class="btn btn-primary">
+                        <i class="bi bi-search"></i>
+                    </button>
+                </div>
+            </form>
+
+            {% include 'paginator.html' with paginator=comptypes get_param='page' aria_label='Component Type Page Navigation' %}
+
+            <div class="list-group mb-3">
+                {% for t in comptypes %}
+                    <a href="{% url 'parts-componenttypes-detail' uuid=t.id %}" class="text-decoration-none">
+                    <li class="list-group-item list-group-item-action d-flex flex-row align-items-center justify-content-between">
+                    <div class="p-2">
+                        {{t.class_name}}
+                    </div>
+                    {% if t.passive %}
+                    <div class="p-2">
+                        <span class="text-muted">&nbsp;passive</span>
+                    </div>
+                    {% endif %}
+                    </li>
+                    </a>
+                {% endfor %}
+            </div>
+            {% include 'paginator.html' with paginator=comptypes get_param='page' aria_label='Component Type Page Navigation' %}
+        </div>
+    </div>
+</div>
+
+{% endblock content %}
+{% block custom_scripts %}
+
+<script type="text/javascript">
+</script>
+{% endblock custom_scripts %}
\ No newline at end of file