site, branding: skeuomorphic marks, and the new Niveus components
The marks are now drawn the way Niveus draws its keys: one light from the upper left, gloss on the faces that catch it, a specular line on the edges that face it, and soft contact shadows. - Shift: shaded slabs, each casting onto the one below. shift-mask.svg is untouched, so the kernel's logo.h coverage mask is unchanged. - Uberblock: bevelled slots in a groove; the newest slot and the root glow. - USB stick: moulded body, steel connector, a lit activity LED. - Pride flag: cloth folds and a hem over the flag's own colours. The pages use the components the new Niveus added: both terminals are .nv-window frames, the origin and first-boot sequences are .nv-steps, the numbers are a .nv-stat-group, and each feature card has an .nv-tile glyph. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01S1giNvrHTrPMPw7V6x1kQ4
This commit is contained in:
Nexoniarz
parent
a8215149a3
commit
c9790df04c
11 changed files with 623 additions and 321 deletions
|
|
@ -8,20 +8,101 @@
|
|||
without it the slab has no thickness where it is widest, and the corner reads
|
||||
as a hole rather than an edge.
|
||||
|
||||
Drawn the way Niveus draws a key: light falls from the upper left, so every
|
||||
top face is brightest at its far-left corner and every edge that faces the
|
||||
light carries a thin specular line. The front faces are lit from above and
|
||||
darken towards the ground; the end walls face away and are darkest. Each slab
|
||||
casts a soft shadow on the one below it, which is what makes the stack read
|
||||
as three objects rather than three stripes.
|
||||
|
||||
Geometry is shared with "shift-mask.svg"; see that file.</desc>
|
||||
|
||||
<defs>
|
||||
<!-- top faces: lit corner to far corner -->
|
||||
<linearGradient id="t1" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0" stop-color="#A48CFF"/>
|
||||
<stop offset="0.55" stop-color="#7C5CFF"/>
|
||||
<stop offset="1" stop-color="#6A48F0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="t2" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0" stop-color="#8064E6"/>
|
||||
<stop offset="0.55" stop-color="#5B44C4"/>
|
||||
<stop offset="1" stop-color="#4E39AE"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="t3" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0" stop-color="#5A48A8"/>
|
||||
<stop offset="0.55" stop-color="#3C2E85"/>
|
||||
<stop offset="1" stop-color="#332772"/>
|
||||
</linearGradient>
|
||||
<!-- front faces: lit at the top edge, falling into shade -->
|
||||
<linearGradient id="f1" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#6E50E8"/>
|
||||
<stop offset="1" stop-color="#4E35BC"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="f2" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#4E3AAE"/>
|
||||
<stop offset="1" stop-color="#372887"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="f3" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#342874"/>
|
||||
<stop offset="1" stop-color="#231A52"/>
|
||||
</linearGradient>
|
||||
<!-- end walls: facing away from the light -->
|
||||
<linearGradient id="w1" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0" stop-color="#4F36B4"/>
|
||||
<stop offset="1" stop-color="#3A2690"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="w2" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0" stop-color="#3A2A86"/>
|
||||
<stop offset="1" stop-color="#2B1F68"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="w3" x1="0" y1="0" x2="1" y2="1">
|
||||
<stop offset="0" stop-color="#261C56"/>
|
||||
<stop offset="1" stop-color="#1A133E"/>
|
||||
</linearGradient>
|
||||
<!-- the gloss across each top face, strongest at its back edge -->
|
||||
<linearGradient id="gloss" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#FFFFFF" stop-opacity="0.38"/>
|
||||
<stop offset="0.45" stop-color="#FFFFFF" stop-opacity="0.08"/>
|
||||
<stop offset="1" stop-color="#FFFFFF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<filter id="soft" x="-20%" y="-40%" width="140%" height="180%">
|
||||
<feGaussianBlur stdDeviation="4"/>
|
||||
</filter>
|
||||
</defs>
|
||||
|
||||
<!-- contact shadows, each cast down and to the right of its slab -->
|
||||
<path fill="#000" opacity="0.35" filter="url(#soft)" d="M58 138 L160 138 L132 170 L28 170 Z"/>
|
||||
<path fill="#000" opacity="0.30" filter="url(#soft)" d="M76 96 L178 96 L150 128 L46 128 Z"/>
|
||||
<path fill="#000" opacity="0.26" filter="url(#soft)" d="M94 54 L196 54 L168 86 L64 86 Z"/>
|
||||
|
||||
<!-- bottom slab -->
|
||||
<path fill="#3C2E85" d="M54 126 L158 126 L128 156 L24 156 Z"/>
|
||||
<path fill="#31256E" d="M24 156 L128 156 L128 167 L24 167 Z"/>
|
||||
<path fill="#291F5C" d="M158 126 L158 137 L128 167 L128 156 Z"/>
|
||||
<path fill="url(#t3)" d="M54 126 L158 126 L128 156 L24 156 Z"/>
|
||||
<path fill="url(#gloss)" d="M54 126 L158 126 L128 156 L24 156 Z"/>
|
||||
<path fill="url(#f3)" d="M24 156 L128 156 L128 167 L24 167 Z"/>
|
||||
<path fill="url(#w3)" d="M158 126 L158 137 L128 167 L128 156 Z"/>
|
||||
<path fill="none" stroke="#FFFFFF" stroke-opacity="0.35" stroke-width="1.2"
|
||||
stroke-linecap="round" d="M24.6 155.4 L54.4 126.6 L157 126.6"/>
|
||||
<path fill="none" stroke="#FFFFFF" stroke-opacity="0.16" stroke-width="1"
|
||||
d="M24 156.5 L128 156.5"/>
|
||||
|
||||
<!-- middle slab -->
|
||||
<path fill="#5B44C4" d="M72 84 L176 84 L146 114 L42 114 Z"/>
|
||||
<path fill="#4B37A6" d="M42 114 L146 114 L146 125 L42 125 Z"/>
|
||||
<path fill="#3F2D8C" d="M176 84 L176 95 L146 125 L146 114 Z"/>
|
||||
<path fill="url(#t2)" d="M72 84 L176 84 L146 114 L42 114 Z"/>
|
||||
<path fill="url(#gloss)" d="M72 84 L176 84 L146 114 L42 114 Z"/>
|
||||
<path fill="url(#f2)" d="M42 114 L146 114 L146 125 L42 125 Z"/>
|
||||
<path fill="url(#w2)" d="M176 84 L176 95 L146 125 L146 114 Z"/>
|
||||
<path fill="none" stroke="#FFFFFF" stroke-opacity="0.42" stroke-width="1.2"
|
||||
stroke-linecap="round" d="M42.6 113.4 L72.4 84.6 L175 84.6"/>
|
||||
<path fill="none" stroke="#FFFFFF" stroke-opacity="0.18" stroke-width="1"
|
||||
d="M42 114.5 L146 114.5"/>
|
||||
|
||||
<!-- top slab -->
|
||||
<path fill="#7C5CFF" d="M90 42 L194 42 L164 72 L60 72 Z"/>
|
||||
<path fill="#6949E0" d="M60 72 L164 72 L164 83 L60 83 Z"/>
|
||||
<path fill="#5B3FC9" d="M194 42 L194 53 L164 83 L164 72 Z"/>
|
||||
<path fill="url(#t1)" d="M90 42 L194 42 L164 72 L60 72 Z"/>
|
||||
<path fill="url(#gloss)" d="M90 42 L194 42 L164 72 L60 72 Z"/>
|
||||
<path fill="url(#f1)" d="M60 72 L164 72 L164 83 L60 83 Z"/>
|
||||
<path fill="url(#w1)" d="M194 42 L194 53 L164 83 L164 72 Z"/>
|
||||
<path fill="none" stroke="#FFFFFF" stroke-opacity="0.55" stroke-width="1.2"
|
||||
stroke-linecap="round" d="M60.6 71.4 L90.4 42.6 L193 42.6"/>
|
||||
<path fill="none" stroke="#FFFFFF" stroke-opacity="0.22" stroke-width="1"
|
||||
d="M60 72.5 L164 72.5"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 5.3 KiB |
Loading…
Reference in a new issue