Figma
ਰੰਗੀਨ ਹਫੜਾ-ਦਫੜੀ ਲਈ ਮੋਨੋਕ੍ਰੋਮ ਚੈਸੀ
ਇਹ ਇੰਟਰਫੇਸ ਇੱਕ ਸਖ਼ਤ, ਉੱਚ-ਵਿਪਰੀਤ ਢਾਂਚਾਗਤ ਕੰਟੇਨਰ ਵਜੋਂ ਕੰਮ ਕਰਦਾ ਹੈ, ਜੋ ਉਪਭੋਗਤਾ ਦੁਆਰਾ ਤਿਆਰ ਕੀਤੀ ਸਮੱਗਰੀ ਨੂੰ ਪੂਰਾ ਵਿਜ਼ੂਅਲ ਦਬਦਬਾ ਦਿੰਦਾ ਹੈ। ਬੇਸਲਾਈਨ ਇੱਕ ਸਖ਼ਤ #000000 ਤੋਂ #ffffff ਪੈਲੇਟ ਹੈ, ਜੋ ਪ੍ਰਾਇਮਰੀ ਬਾਰਡਰਾਂ ਅਤੇ ਟੈਕਸਟ ਲਈ ਸੰਪੂਰਨ ਵੱਧ ਤੋਂ ਵੱਧ ਕੰਟ੍ਰਾਸਟ ਦੇ ਪੱਖ ਵਿੱਚ ਸਲੇਟੀ ਦੇ ਸੂਖਮ ਰੰਗਾਂ ਨੂੰ ਛੱਡਦਾ ਹੈ। ਟਾਈਪੋਗ੍ਰਾਫਿਕ ਦਰਜਾਬੰਦੀ ਲਗਭਗ ਪੂਰੀ ਤਰ੍ਹਾਂ ਰੰਗ ਭਿੰਨਤਾਵਾਂ ਦੀ ਬਜਾਏ ਆਕਾਰ ਅਤੇ ਹਮਲਾਵਰ ਨਕਾਰਾਤਮਕ ਅੱਖਰ ਸਪੇਸਿੰਗ 'ਤੇ ਅਧਾਰਤ ਹੈ, ਟੈਕਸਟ ਦੀਆਂ ਵੱਡੀਆਂ ਲਾਈਨਾਂ ਨੂੰ ਸੰਘਣੇ ਗ੍ਰਾਫਿਕ ਬਲਾਕਾਂ ਵਿੱਚ ਬਦਲਦੀ ਹੈ। ਬਾਰਡਰ ਰੇਡੀਅਸ ਦਾ ਤਰਕ ਇੱਕ ਸਖ਼ਤ ਦੁਵਿਧਾ ਪੈਦਾ ਕਰਦਾ ਹੈ: ਗਲੋਬਲ ਨੈਵੀਗੇਸ਼ਨ ਤੱਤਾਂ ਲਈ 50px ਬਾਹਰੀ "ਨਹੁੰ" ਜਾਣਬੁੱਝ ਕੇ ਸਮੱਗਰੀ ਕੰਟੇਨਰਾਂ ਦੇ ਸਖ਼ਤ 0px ਕੋਨਿਆਂ ਨਾਲ ਵਿਪਰੀਤ ਹੁੰਦੇ ਹਨ।
ਰਚਨਾਵਾਂ ਵਿਊਪੋਰਟ ਨੂੰ ਕੇਂਦਰਿਤ ਕਰਨ ਵਾਲੀਆਂ ਅਤਿ ਅਧਿਕਤਮ-ਚੌੜਾਈ ਵਾਲੀਆਂ ਬਾਰਡਰਾਂ (1440px ਅਧਿਕਤਮ) 'ਤੇ ਅਧਾਰਤ ਹਨ ਅਤੇ ਇਸ ਵਿੱਚ ਸਮੱਗਰੀ ਦੇ ਸੰਘਣੇ ਕਲੱਸਟਰ ਸ਼ਾਮਲ ਹਨ ਜੋ ਖੁੱਲ੍ਹੇ ਮੈਕਰੋ-ਸਪੇਸ (ਭਾਗਾਂ ਵਿਚਕਾਰ 96-120px ਵ੍ਹਾਈਟਸਪੇਸ) ਦੁਆਰਾ ਵੱਖ ਕੀਤੇ ਗਏ ਹਨ। "ਹੀਰੋ" ਆਰਕੀਟਾਈਪ ਅਕਸਰ ਇੱਕ ਫਲੋਟਿੰਗ, ਪੂਰੀ ਤਰ੍ਹਾਂ ਕੇਂਦਰਿਤ UI ਬਲਾਕ ਦੇ ਹੇਠਾਂ ਗਤੀਸ਼ੀਲ ਤੌਰ 'ਤੇ ਐਂਕਰ ਕੀਤੇ ਚਿੱਤਰਾਂ ਦੀ ਇੱਕ ਅਸਮਿਤ ਗੈਲਰੀ ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ। ਫੋਲਡ ਦੇ ਹੇਠਾਂ, ਜਾਣਕਾਰੀ ਤੁਰੰਤ ਇੱਕ ਸਖ਼ਤ ਚਾਰ-ਕਾਲਮ ਗਰਿੱਡ ਦੇ ਅਨੁਕੂਲ ਹੋ ਜਾਂਦੀ ਹੈ ਜਿਸ ਵਿੱਚ ਕੋਈ ਹਾਸ਼ੀਏ ਨਹੀਂ ਹੁੰਦੇ, ਕਾਰਡਾਂ ਦੇ ਦੁਹਰਾਉਣ ਵਾਲੇ ਕਲੱਸਟਰਾਂ ਨੂੰ ਫਰੇਮ ਕਰਦੇ ਹੋਏ, ਫਰੇਮ ਤੋਂ ਹਾਸ਼ੀਏ ਨੂੰ ਖਤਮ ਕਰਦੇ ਹੋਏ ਵਸਤੂ ਘਣਤਾ ਨੂੰ ਵੱਧ ਤੋਂ ਵੱਧ ਕਰਦੇ ਹਨ।
ਵਿਜ਼ੂਅਲ ਡਿਜ਼ਾਈਨ ਉਪਭੋਗਤਾ-ਕੇਂਦ੍ਰਿਤ ਨਤੀਜਿਆਂ 'ਤੇ ਅਧਾਰਤ ਹੈ। ਤਸਵੀਰਾਂ ਨੂੰ ਫਲੈਟ, ਫਰੇਮ ਰਹਿਤ ਵਰਗਾਂ ਜਾਂ ਖਿੰਡੇ ਹੋਏ, ਓਵਰਲੈਪਿੰਗ ਟੁਕੜਿਆਂ ਦੇ ਰੂਪ ਵਿੱਚ ਪ੍ਰਦਰਸ਼ਿਤ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਜੋ ਕਿ ਭੌਤਿਕ ਵਸਤੂਆਂ ਦੀ ਯਾਦ ਦਿਵਾਉਂਦੇ ਹਨ, ਇੱਕ ਬਿਲਕੁਲ ਖਾਲੀ ਪਿਛੋਕੜ ਦੇ ਵਿਰੁੱਧ। ਵੈੱਬਸਾਈਟ 'ਤੇ ਤਸਵੀਰਾਂ ਰੰਗ ਦਾ ਇੱਕੋ ਇੱਕ ਸਰੋਤ ਹਨ। ਕੋਈ ਜੀਵਨ ਸ਼ੈਲੀ ਫੋਟੋਗ੍ਰਾਫੀ ਤੱਤ ਜਾਂ ਮਿਆਰੀ ਕਾਰਪੋਰੇਟ ਚਿੱਤਰ ਨਹੀਂ ਹਨ—ਹਰੇਕ ਗ੍ਰਾਫਿਕ ਤੱਤ ਇੱਕ ਡਿਜੀਟਲ ਕੈਨਵਸ ਦਾ ਇੱਕ ਸਟੀਕ, ਸ਼ਾਬਦਿਕ ਸਨੈਪਸ਼ਾਟ ਹੈ, ਜੋ ਇੱਕੋ ਸਮੇਂ ਉਤਪਾਦ ਸਬੂਤ ਅਤੇ ਇੱਕ ਪ੍ਰਾਇਮਰੀ ਸੁਹਜ ਤੱਤ ਵਜੋਂ ਕੰਮ ਕਰਦਾ ਹੈ।
ਪੈਲੇਟ
ਬ੍ਰਾਂਡ
- Context Action Violet
#4d49fc— ਸਬ-ਪੈਨਲਾਂ ਦੇ ਅੰਦਰ ਸਥਾਨਕ ਪ੍ਰਾਇਮਰੀ ਕਾਲ ਟੂ ਐਕਸ਼ਨ - ਇੱਕ ਸਿੰਗਲ ਇੰਟਰੱਪਟਿਵ ਰੰਗ ਫੋਕਲ ਪੁਆਇੰਟ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ।
ਨਿਰਪੱਖ
- Absolute Canvas
#ffffff— ਪੰਨੇ ਦੀ ਪਿੱਠਭੂਮੀ, ਫਲੋਟਿੰਗ ਟੂਲਬਾਰ, ਉੱਚੇ ਹੋਏ ਪੈਨਲ ਬੇਸ। - Structural Ink
#000000— ਮੁੱਢਲਾ ਫੌਂਟ, ਠੋਸ ਬਟਨ ਬੈਕਗ੍ਰਾਊਂਡ, ਬਟਨ ਰੂਪਰੇਖਾ। - Graphite Metadata
#595959— ਸੈਕੰਡਰੀ ਲੇਖਕ ਲਿਖਤ, ਸਥਾਨੀਕ੍ਰਿਤ ਉਪ-ਟੈਕਸਟ, ਪਲੇਸਹੋਲਡਰ ਮੁੱਲ - Boundary Frame
#e2e2e2— ਸੂਖਮ ਵਿਭਾਜਕ ਅਤੇ ਅਕਿਰਿਆਸ਼ੀਲ ਇਨਪੁੱਟ ਖੇਤਰ ਸੀਮਾਵਾਂ। - Angular Teal
#33dfdf— ਸਜਾਵਟੀ ਪ੍ਰਭਾਵ, ਲੋਡਿੰਗ ਸੂਚਕ ਅਤੇ ਕਿਰਿਆਸ਼ੀਲ ਕਰਸਰ ਵਿਜ਼ੂਅਲਾਈਜ਼ੇਸ਼ਨ।
ਟਾਈਪੋਗ੍ਰਾਫੀ
12 ਤੋਂ 72px ਤੱਕ · 6 ਕਦਮ
- figmaSans — ਬਦਲ: Inter · ਰੂਪਰੇਖਾ 320, 330, 340, 400, 450, 480, 520, 700 · ਇੱਕ ਬਹੁਪੱਖੀ ਟੂਲ ਜੋ ਡਿਸਪਲੇ ਸਿਰਲੇਖਾਂ ਤੋਂ ਲੈ ਕੇ ਨੈਵੀਗੇਸ਼ਨ ਲੇਬਲਾਂ ਤੱਕ ਹਰ ਚੀਜ਼ ਦਾ ਪ੍ਰਬੰਧਨ ਕਰਦਾ ਹੈ। ਇਹ ਆਪਟੀਕਲ ਨੈਗੇਟਿਵ ਟਰੈਕਿੰਗ ਨੂੰ ਸੋਧ ਕੇ ਇੱਕ ਵਿਲੱਖਣ ਦਿੱਖ ਬਣਾਉਂਦਾ ਹੈ।
- figmaMono — ਬਦਲ: JetBrains Mono · ਰੂਪਰੇਖਾ 400 · ਮਾਈਕ੍ਰੋਟੈਗ, ਕੋਆਰਡੀਨੇਟ ਟਰੈਕਿੰਗ, ਅਤੇ ਤਕਨੀਕੀ ਰੂਪ ਜੋ ਸਮੱਗਰੀ ਨਾਲੋਂ ਉਪਭੋਗਤਾ ਇੰਟਰਫੇਸ ਤੱਤਾਂ ਵਜੋਂ ਵਧੇਰੇ ਕੰਮ ਕਰਦੇ ਹਨ।
ਅੰਤਰਾਲ ਅਤੇ ਰੂਪ
| ਉਦੇਸ਼ | ਭਾਵ |
|---|---|
| ਘਣਤਾ | ਸੰਘਣਾ |
| ਮੁੱਢਲਾ ਕਦਮ | 24px |
| ਬਟਨ ਦਾ ਘੇਰਾ | 8px |
| ਕਾਰਡ ਦਾ ਘੇਰਾ | 12px |
| ਪਰਛਾਵੇਂ | ਪਰਛਾਵਿਆਂ ਦੀ ਬਜਾਏ ਕੋਈ - ਬਾਰਡਰ ਨਹੀਂ |
| ਭਾਗਾਂ ਵਿਚਕਾਰ | 96-120px |
| ਪੰਨੇ ਦੀ ਚੌੜਾਈ | 1440px |
AI ਤੁਹਾਡੀ ਵੈੱਬਸਾਈਟ ਨੂੰ Figma ਸ਼ੈਲੀ ਵਿੱਚ ਬਣਾਏਗਾ ਅਤੇ ਇਸਨੂੰ ਭਰ ਦੇਵੇਗਾ।
- ਲਿੰਕ ਰਾਹੀਂ ਉਤਪਾਦਾਂ ਅਤੇ ਪੋਸਟਾਂ ਨਾਲ ਭਰੋ - Instagram, TikTok, Facebook ।
- ਆਪਣੀ ਪੁਰਾਣੀ ਸਾਈਟ ਤੋਂ ਸਮੱਗਰੀ ਟ੍ਰਾਂਸਫਰ ਕਰੋ—ਬੱਸ ਪਤਾ ਦੱਸੋ।
- ਸਭ ਤੋਂ ਵਧੀਆ ਇੰਜਣ 'ਤੇ ਆਧੁਨਿਕ ਡਿਜ਼ਾਈਨ: ਸਰਵਰ ਰੈਂਡਰਿੰਗ ਅਤੇ SEO ਔਪਟੀਮਾਈਜੇਸ਼ਨ ਦੇ ਨਾਲ React ( Next.js)।
- ਖੋਜ ਨਤੀਜਿਆਂ ਅਤੇ ਨਿਊਰਲ ਨੈੱਟਵਰਕ ਸਿਫ਼ਾਰਸ਼ਾਂ ਲਈ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਵੈਚਾਲਿਤ SEO ਅਨੁਕੂਲਤਾ।
ਮਿਲਦੇ-ਜੁਲਦੇ ਸਟਾਈਲ
- Caldera — ਗਰਮ ਚੂਨੇ ਦੇ ਪੱਥਰ 'ਤੇ ਅੱਗ ਲਗਾਓ। ਕੈਨਵਸ ਕੱਚਾ, ਗਰਮ ਪਲਾਸਟਰ ਹੈ, ਅਤੇ ਹਰੇਕ ਸੰਤਰੀ ਤੱਤ ਸਤ੍ਹਾ 'ਤੇ ਦਬਾਏ ਹੋਏ ਧੁਖਦੇ ਅੰਗਿਆਰਿਆਂ ਵਾਂਗ ਦਿਖਾਈ ਦਿੰਦਾ ਹੈ।
- Vercel — ਚਿੱਟੇ ਕਾਗਜ਼ 'ਤੇ ਛਾਪਿਆ ਗਿਆ ਟਰਮੀਨਲ
- Dylanbrouwer — ਸੂਰਜ ਡੁੱਬਣ ਵੇਲੇ ਬੇਰਹਿਮ ਫਾਊਂਡਰੀ
- Headspace — ਗਰਮ ਕਾਗਜ਼ 'ਤੇ ਇੱਕ ਧੁੱਪ ਵਾਲਾ ਤੰਦਰੁਸਤੀ ਕੋਨਾ
- WHOOP — ਅੱਧੀ ਰਾਤ ਨੂੰ ਪ੍ਰਦਰਸ਼ਨ ਪ੍ਰਯੋਗਸ਼ਾਲਾ - ਇੱਕ ਕਾਲੇ ਨਾਟਕੀ ਖਾਲੀਪਣ ਦੇ ਹੇਠਾਂ ਚਿੱਟੇ ਕਲੀਨਿਕਲ ਪ੍ਰਯੋਗਸ਼ਾਲਾ ਟੇਬਲ, ਬਿਜਲੀ ਦੀ ਇੱਕ ਸਿੰਗਲ ਜਾਮਨੀ ਨਬਜ਼
- (dot)connect — ਕੋਲੇ ਦੇ ਇੱਕ ਟੁਕੜੇ ਨਾਲ ਇੱਕ ਸਵਿਸ ਇੰਜੀਨੀਅਰਿੰਗ ਡਰਾਇੰਗ
- Together AI — ਗਲੇਸ਼ੀਅਲ ਪੇਪਰ 'ਤੇ ਖੋਜ ਕੰਸੋਲ
- Vivid+Co — ਓਬਸੀਡੀਅਨ ਰਾਹੀਂ ਪ੍ਰਿਜ਼ਮੈਟਿਕ ਰੌਸ਼ਨੀ
- Sequel — ਹਨੇਰੇ ਤੋਂ ਬਾਅਦ ਇੱਕ ਨਿੱਜੀ ਸਕ੍ਰੀਨਿੰਗ ਹੀ ਇੱਕ ਹਨੇਰੇ ਸਿਨੇਮਾ ਵਿੱਚ ਇੱਕੋ ਇੱਕ ਨਿੱਘੀ ਰੌਸ਼ਨੀ ਹੁੰਦੀ ਹੈ।
- v0 by Vercel — ਖਰਾਦ ਡਰਾਇੰਗ। ਸ਼ੁੱਧਤਾ ਅਤੇ ਕਾਰਜਸ਼ੀਲਤਾ ਸਭ ਤੋਂ ਮਹੱਤਵਪੂਰਨ ਹਨ, ਹਰੇਕ ਤੱਤ ਇੱਕ ਸਾਫ਼, ਤਕਨੀਕੀ ਤੌਰ 'ਤੇ ਸੰਪੂਰਨ ਸਤ੍ਹਾ 'ਤੇ ਇੱਕ ਸਪਸ਼ਟ ਉਦੇਸ਼ ਦੀ ਪੂਰਤੀ ਕਰਦਾ ਹੈ।
- ThoughtLab — ਇੱਕ ਲਾਲ ਰੰਗ ਦੇ ਸਿਗਨਲ ਵਾਲਾ ਇੱਕ ਓਬਸੀਡੀਅਨ ਸਮਾਰਕ। ਕਾਲੇ ਖਾਲੀਪਣ ਦਾ ਇੱਕ ਕੈਨਵਸ, ਜਿੱਥੇ ਗਿਰਜਾਘਰ ਵਿੱਚ ਇੱਕੋ ਇੱਕ ਸੰਤ੍ਰਿਪਤ ਲਾਲ ਵਸਤੂ, ਵੱਡੇ ਚਿੱਟੇ ਅੱਖਰਾਂ ਵਿੱਚ ਛਪੀ ਹੋਈ, ਇੱਕ ਸਿੰਗਲ ਰੰਗੀਨ ਚਿੱਤਰ ਹੈ।
- Dovetail — ਕਾਲੇ ਚੰਦ ਦੇ ਹੇਠਾਂ ਇੱਕ ਬਲੂਪ੍ਰਿੰਟ—ਮੁਸ਼ਕਿਲ ਨਾਲ ਦਿਖਾਈ ਦੇਣ ਵਾਲੀਆਂ ਗ੍ਰਾਫ ਲਾਈਨਾਂ, ਚਿੱਟਾ ਫੌਂਟ, ਇੱਕ ਜਾਮਨੀ ਚਮਕ