--- a/qmsk/pngtile/pngtile.py	Sat Oct 04 16:16:00 2014 +0300
+++ b/qmsk/pngtile/pngtile.py	Sat Oct 04 16:47:04 2014 +0300
@@ -90,15 +90,35 @@
         """
 
         for item, type in self.list(name):
+            if not type:
+                # skip dirs
+                continue
+
             if name:
                 item_name = name + '/' + item
             else:
                 item_name = item
             
+            # open Image
+            image, image_name = self.open(item_name)
+            image_info = image.info()
+            
+            # preview <img>
+            x = image_info['img_width'] / 2
+            y = image_info['img_height'] / 2
+            zoom = 2
+
+            img_src = self.tiles_url(image_name, w=640, h=320,
+                    t       = image_info['cache_mtime'],
+                    x       = x >> zoom,
+                    y       = y >> zoom,
+                    zoom    = zoom,
+            )
+
+            # overlay title
             item_title = self.title(item_name)
 
-            if type:
-                yield item_title, item_name
+            yield item_title, item_name, img_src
 
     def tiles_url (self, name=None, **query):
         """

--- a/qmsk/pngtile/static/qmsk.pngtile/map.css	Sat Oct 04 16:16:00 2014 +0300
+++ b/qmsk/pngtile/static/qmsk.pngtile/map.css	Sat Oct 04 16:47:04 2014 +0300
@@ -1,3 +1,38 @@
+/* Index view */
+.image {
+    position: relative;
+
+    margin-top: 1em;
+
+    border: none;
+    padding: 0;
+    
+    width: 640px;
+    height: 320px;
+}
+
+.image a {
+    display: block;
+}
+
+.image .title {
+    position: absolute;
+
+    top: 50%;
+    left: 0px;
+    right: 0px;
+    width: 100%;
+
+    text-align: center;
+    font-size: xx-large;
+    color: white;
+}
+
+.image a:hover .title {
+    text-decoration: underline;
+}
+
+/* Image view */
 #map {
     overflow: hidden;
     position: absolute;

--- a/qmsk/pngtile/templates/qmsk.pngtile/index.html	Sat Oct 04 16:16:00 2014 +0300
+++ b/qmsk/pngtile/templates/qmsk.pngtile/index.html	Sat Oct 04 16:47:04 2014 +0300
@@ -1,9 +1,18 @@
 {% extends "qmsk.pngtile/view.html" %}
+{% load staticfiles %}
+
+{% block head %}
+    <link rel="stylesheet" href="{% static "qmsk.pngtile/map.css" %}">
+{% endblock %}
+
 
 {% block content %}
-{% for item, item_name in index_items %}
-    <div>
-        <a href="{% url 'image' item_name %}">{{item}}</a>
+{% for item_title, item_name, item_img in index_items %}
+    <div class="image">
+        <a href="{% url 'image' item_name %}">
+            <img src="{{ item_img }}" />
+            <div class="title">{{item_title}}</div>
+        </a>
     </div>
 {% endfor %}
 {% endblock %}